안드로이드(Android) Custom Spinner Layout 레이아웃 사용방법 (콤보박스)
Custom Spinner 레이아웃 사용방법
기본 스피너의 레이아웃(Layout)을 변경해서 사용해보자. 스피너는 콤보박스로 생각하면 된다. 스피너는 하나의 어레이어댑터가 필요하다. 어레이 어댑터를 하나 선언한 후 그것을 스피너의 setAdapter메소드를 사용하여 적용해주어야 하는 구조로 이루어져있다. setOnItemSelectedListener메소를 사용하여 스피너에서 아이템을 선택하였을 때 실행할 코드를 작성할 수 있다.
그럼 예제를 살펴보자.
■res/layout/activity_spiner.xml의 내용을 다음과 같이 수정한다. Spinner를 하나 추가해주었다.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:id="@+id/title_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
android:gravity="center"
android:orientation="horizontal">
<Spinner
android:id="@+id/spinner1"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:spinnerMode="dropdown" />
</LinearLayout>
</RelativeLayout>■res/layout/custom_spiner_item.xml 변경될 스피너의 레이아웃을 신규로 생성한다.
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="17dp"
android:layout_gravity="center"
android:gravity="center"
android:ellipsize="marquee"
android:textAlignment="inherit"/>■SpinerActivity.class 내용은 다음과 같다. 기본적으로 제공하는 simple_spinner_item.xml 레이아웃 대신 신규로 생성한 custom_spiner_item.xml을 사용하였다.
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.Toast;
public class SpinerActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_spiner);
final String[] country = {"-국가 선택-","한국", "미국", "독일", "중국", "일본", "스페인"};
Spinner spiner = (Spinner) findViewById(R.id.spinner1);
//ArrayAdapter adapter = new ArrayAdapter(this, android.R.layout.simple_spinner_item, categories);
//adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
ArrayAdapter<String> adapter3 = new ArrayAdapter<String>(this, R.layout.custom_spiner_item, country);
spiner.setAdapter(adapter3);
spiner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> adapterView, View view, int position, long id) {
Toast.makeText(getApplicationContext(), "Selected Country: "+categories[position] , Toast.LENGTH_SHORT).show();
}
@Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
});
}
}코드상에서 콤보박스에 넣을 국가 정보에 대해 자료형으로 문자형 배열로 선언하였다. 아래 예시와 같이 ArrayList를 사용하여도 된다.
// Spinner Drop down elements
List<String> categories = new ArrayList<String>();
categories.add(“-국가 선택-“);
categories.add(“한국“);
categories.add(“미국“);
categories.add(“독일“);
categories.add(“스페인“);
데이터베이스에 데이터를 조회 후 ArrayList에 담는 방법을 추천한다.
■AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.test.gugudan">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".SpinerActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>■실행결과
안드로이드 스튜디오에서 Run ‘app’ 아이콘 버튼을 클릭하여 실행한다. 단축키는 Shift + F10 이다.
휴대폰을 USB통하여 연결하거나 에뮬레이터를 통하여 실행할 수 있다. 예전에 비해 요즘 에뮬레이터 실행 속도가 굉장히 좋아졌다. 예전에는 느려서 도저히 에뮬레이터를 사용할 수 없었다.
■ 이번에는 텍스트뷰와 이미지가 추가된 레이아웃을 사용하여 보자.
res/layout/custom_spiner_item2.xml 변경될 스피너의 레이아웃을 신규로 생성한다. ImageView와 TextView를 추가하였다.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:gravity="center|left"
android:padding="5dp"
android:orientation="horizontal">
<ImageView
android:id="@+id/icon_view"
android:layout_width="15dp"
android:layout_height="15dp"
android:src="@android:drawable/ic_dialog_info"/>
<TextView
android:id="@+id/content_text"
android:layout_marginStart="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>■SpinerActivity.class 내용은 기존 코드에서 custom_spiner_item2.xml을 대입하였다. 그리고 중요한 점은 아이템을 뿌려줄 대상을 지정해주어야한다. 그러니까 국가정보를 보여줄 타켓을 지정해야한다. ArrayAdapter 선언시 지정해주면된다.
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
import android.widget.Toast;
public class SpinerActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_spiner);
final String[] country = {"한국", "미국", "독일", "중국", "일본", "스페인"};
Spinner spiner = (Spinner) findViewById(R.id.spinner1);
ArrayAdapter<String> adapter4 = new ArrayAdapter<String>(this, R.layout.custom_spiner_item2, R.id.content_text, country);
spiner.setAdapter(adapter4);
spiner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
@Override
public void onItemSelected(AdapterView<?> adapterView, View view, int position, long id) {
Toast.makeText(getApplicationContext(), "Selected Country: "+categories[position] , Toast.LENGTH_SHORT).show();
}
@Override
public void onNothingSelected(AdapterView<?> adapterView) {
}
});
}
}■실행결과
다음에는 ArrayAdapter를 커스터마이징을 해보자. ArrayAdapter를 커스터마이징해야하는 경우는 내가 뿌리고 하는 데이터가 여러개 일 경우에 해당한다. 이번 샘플은 단순히 국가정보만 뿌려주었다. 여기에 영어 국가명을 추가로 뿌려주고 싶다면???? ArrayAdpter를 커스터마이징 하지 않는 이상 불가능하다.!!!
