Android에서 스피너를 사용자 정의하는 방법


140

Spinner30dp와 같은 드롭 다운에 사용자 지정 높이를 추가하고 의 드롭 다운 목록의 디바이더를 숨기고 싶습니다 Spinner.

지금까지 다음 스타일을 구현하려고했습니다 Spinner.

<style name="spinner_style">
        <item name="android:paddingLeft">0dp</item>
        <item name="android:dropDownWidth">533dp</item>
        <item name="android:showDividers">none</item>
        <item name="android:dividerHeight">0dp</item>
        <item name="android:popupBackground">@drawable/new_bg</item>
        <item name="android:dropDownHeight">70dp</item>
        <item name="android:scrollbarAlwaysDrawVerticalTrack">true</item>
        <item name="android:dropDownSelector">@android:color/white</item>
 </style>

내 스피너의 코드는 다음과 같습니다.

<Spinner
            android:id="@+id/pioedittxt5"
            android:layout_width="543dp"
            android:layout_height="63dp"
            android:layout_toRightOf="@+id/piotxt5"
            android:background="@drawable/spinner"
            style="@style/spinner_style"
            android:dropDownVerticalOffset="-53dp"
            android:spinnerMode="dropdown"
            android:drawSelectorOnTop="true"
            android:entries="@array/travelreasons"
            android:prompt="@string/prompt" />

그러나 아무것도 작동하지 않는 것 같습니다.



어떤 스타일도 적용되지 않습니까? popupBackGround 또는 다른 것? 이상한.
Chintan Soni

@Houcine : 나는 이미 그 예를 시도했습니다 .. 드롭 다운 목록의 높이를 조정하고 싶습니다
Shruti

@ shree202 : 스타일이 적용되지 않음
Shruti

1
@ComeIn은 Android 스타일이 아니라 그가 만든 사용자 지정 스타일입니다. 그래서 그는 방금 "style ="
CyberClaw

답변:


194

스피너에 대한 사용자 정의 레이아웃으로 사용자 정의 어댑터를 작성하십시오.

Spinner spinner = (Spinner) findViewById(R.id.pioedittxt5);
ArrayAdapter<CharSequence> adapter = ArrayAdapter.createFromResource(this,
        R.array.travelreasons, R.layout.simple_spinner_item);
adapter.setDropDownViewResource(R.layout.simple_spinner_dropdown_item);
spinner.setAdapter(adapter);

R.layout.simple_spinner_item

<TextView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/text1"
    style="@style/spinnerItemStyle"
    android:maxLines="1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:ellipsize="marquee" />

R.layout.simple_spinner_dropdown_item

<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/text1"
    style="@style/spinnerDropDownItemStyle"
    android:maxLines="1"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/dropdownListPreferredItemHeight"
    android:ellipsize="marquee" />

스타일에서는 요구 사항에 따라 사용자 정의 치수와 높이를 추가하십시오.

 <style name="spinnerItemStyle" parent="android:Widget.TextView.SpinnerItem">

  </style>

  <style name="spinnerDropDownItemStyle" parent="android:TextAppearance.Widget.TextView.SpinnerItem">

  </style>

3
변경 시도 <item name="android:height"><item name="android:layout_height">
Tarun

1
그냥 :( 지금 자극 받고 ... ... ... 시도하지만 효과에 회신 지난 3-4일에 대한 켜기 / 끄기이 작업에 대한 고맙습니다
7bluephoenix을

5
@Tarun, android:id="@+android:id/text1"simple_spinner_dropdown_item.xml 파일에 필요하지 않습니까?
batbrat

1
R.layout.simple_spinner_dropdown_item에서 android : layout_height 값을 "? attr / dropdownListPreferredItemHeight"로 변경하거나 "오류 : 속성이 공개되지 않았습니다"
Loenix

9
이 답변에 대한 향후 방문자의 경우 : 레이아웃 내에 TextView 및 CheckedTextview를 래핑하지 마십시오 . layout_file.xml 파일에 직접 게시하십시오. 실수가 무엇인지 알 때까지 몇 시간 동안 여기에 갇혀있었습니다.
Francisco Romero

95

다음과 같이 완전히 사용자 정의 스피너 디자인을 만들 수 있습니다

1 단계 : 드로어 블 폴더에서 스피너의 테두리에 background.xml을 만듭니다.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@android:color/transparent" />
<corners android:radius="5dp" />
<stroke
android:width="1dp"
   android:color="@android:color/darker_gray" />
</shape>

2 단계 : 스피너의 레이아웃 디자인을 위해이 드롭 다운 아이콘 또는 이미지 드롭을 사용하십시오 .png 여기에 이미지 설명을 입력하십시오

 <RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginRight="3dp"
    android:layout_weight=".28"
    android:background="@drawable/spinner_border"
    android:orientation="horizontal">

    <Spinner
        android:id="@+id/spinner2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_gravity="center"
        android:background="@android:color/transparent"
        android:gravity="center"
        android:layout_marginLeft="5dp"
        android:spinnerMode="dropdown" />

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:layout_gravity="center"
        android:src="@mipmap/drop" />

</RelativeLayout>

마지막으로 아래 이미지처럼 보이고 둥근 영역에서 클릭 할 수 있으며 imageView에 대해 클릭 리스터를 작성할 필요가 없습니다.

여기에 이미지 설명을 입력하십시오

3 단계 : 드롭 다운 디자인의 경우 드롭 다운 목록보기에서 선을 제거하고 배경색을 변경하십시오.

Spinner spinner = (Spinner) findViewById(R.id.spinner1);
String[] years = {"1996","1997","1998","1998"};
ArrayAdapter<CharSequence> langAdapter = new ArrayAdapter<CharSequence>(getActivity(), R.layout.spinner_text, years );
langAdapter.setDropDownViewResource(R.layout.simple_spinner_dropdown);
mSpinner5.setAdapter(langAdapter);

레이아웃 폴더에서 R.layout.spinner_text.xml을 만듭니다.

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layoutDirection="ltr"
android:id="@android:id/text1"
style="@style/spinnerItemStyle"
android:singleLine="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:paddingLeft="2dp"
/>

레이아웃 폴더에서 simple_spinner_dropdown.xml을 작성하십시오.

<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
style="@style/spinnerDropDownItemStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:paddingBottom="5dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingTop="5dp"
android:singleLine="true" />

스타일에서는 요구 사항에 따라 사용자 지정 치수와 높이를 추가 할 수 있습니다.

<style name="spinnerItemStyle" parent="android:Widget.TextView.SpinnerItem">
</style>

<style name="spinnerDropDownItemStyle" parent="android:TextAppearance.Widget.TextView.SpinnerItem">
</style>

마지막으로

여기에 이미지 설명을 입력하십시오

요구 사항에 따라 simple_spinner_dropdown.xml의 배경색 또는 텍스트 색을 변경하여 배경색 및 드롭 다운 색의 텍스트를 변경할 수 있습니다.


첫 번째 코드에서 6 줄의 android : height = "1dp"를 의미합니까?
Willi Mentzel

실수로 두 번 안드로이드 쓰기 : 폭 = "1DP"
Binesh 쿠마

2
문제 없습니다. "1dp"로 높이를 지정하거나 복제본인지 확실하지 않기 때문에 직접 편집하고 싶지 않았습니다. 그래도 좋은 대답입니다. :)
Willi Mentzel 2016 년

@BineshKumar 안녕하세요, CheckedTextView를 어디에 선언했는지 알고 있나요? 내가 코드에 붙여 넣을 때 때문에 요소가 먼저 선언해야 나에게 말했다
hyperfkcb을

2
남자, 당신은 당신의 레이아웃과 드로어 블에 이름을 사용할 수 있었지만, 나는 30 분을 보냈지 만 여전히 무엇을 해야할지 전혀 모른다. 나쁜 대답에 대한 마이너스.
Anton Kizema

21

내가 지금까지 찾은 가장 우아하고 유연한 솔루션은 다음과 같습니다. http://android-er.blogspot.sg/2010/12/custom-arrayadapter-for-spinner-with.html

기본적으로 다음 단계를 수행하십시오.

  1. 드롭 다운 항목에 대한 사용자 정의 레이아웃 xml 파일을 작성하십시오. spinner_item.xml이라고하겠습니다.
  2. 드롭 다운 어댑터에 대한 사용자 정의보기 클래스를 작성하십시오. 이 사용자 정의 클래스에서는 getView () 및 getDropdownView () 메소드에서 사용자 정의 드롭 다운 항목 레이아웃을 겹쳐 쓰고 설정해야합니다. 내 코드는 다음과 같습니다.

    public class CustomArrayAdapter extends ArrayAdapter<String>{
    
    private List<String> objects;
    private Context context;
    
    public CustomArrayAdapter(Context context, int resourceId,
         List<String> objects) {
         super(context, resourceId, objects);
         this.objects = objects;
         this.context = context;
    }
    
    @Override
    public View getDropDownView(int position, View convertView,
        ViewGroup parent) {
        return getCustomView(position, convertView, parent);
    }
    
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
      return getCustomView(position, convertView, parent);
    }
    
    public View getCustomView(int position, View convertView, ViewGroup parent) {
    
    LayoutInflater inflater=(LayoutInflater) context.getSystemService(  Context.LAYOUT_INFLATER_SERVICE );
    View row=inflater.inflate(R.layout.spinner_item, parent, false);
    TextView label=(TextView)row.findViewById(R.id.spItem);
     label.setText(objects.get(position));
    
    if (position == 0) {//Special style for dropdown header
          label.setTextColor(context.getResources().getColor(R.color.text_hint_color));
    }
    
    return row;
    }
    
    }
  3. 활동 또는 단편에서 스피너보기에 사용자 정의 어댑터를 사용하십시오. 이 같은:

    Spinner sp = (Spinner)findViewById(R.id.spMySpinner);
    ArrayAdapter<String> myAdapter = new CustomArrayAdapter(this, R.layout.spinner_item, options);
    sp.setAdapter(myAdapter);

여기서 options는 드롭 다운 항목 문자열 목록입니다.


나를위한 트릭은 getDropDownView를 재정의하고 getView를 재정의했지만 해당 메소드를 재정의해야한다는 것을 알지 못했습니다.
estebanuri

7

이 시도

다른 솔루션을 시도 할 때 많은 문제에 직면했습니다 ... 많은 R & D 후에 이제 솔루션을 얻었습니다.

  1. 레이아웃 폴더에 custom_spinner.xml을 생성하고이 코드를 붙여 넣기

     <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorGray">
    <TextView
    android:id="@+id/tv_spinnervalue"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/colorWhite"
    android:gravity="center"
    android:layout_alignParentLeft="true"
    android:textSize="@dimen/_18dp"
    android:layout_marginTop="@dimen/_3dp"/>
    <ImageView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:background="@drawable/men_icon"/>
    </RelativeLayout>
  2. 당신의 활동에서

    Spinner spinner =(Spinner)view.findViewById(R.id.sp_colorpalates);
    String[] years = {"1996","1997","1998","1998"};
    spinner.setAdapter(new SpinnerAdapter(this, R.layout.custom_spinner, years));
  3. 새로운 종류의 어댑터를 만들다

    public class SpinnerAdapter extends ArrayAdapter<String> {
    private String[] objects;
    
    public SpinnerAdapter(Context context, int textViewResourceId, String[] objects) {
        super(context, textViewResourceId, objects);
        this.objects=objects;
    }
    
    @Override
    public View getDropDownView(int position, View convertView, @NonNull ViewGroup parent) {
        return getCustomView(position, convertView, parent);
    }
    
    @NonNull
    @Override
    public View getView(int position, View convertView, @NonNull ViewGroup parent) {
        return getCustomView(position, convertView, parent);
    }
    
    private View getCustomView(final int position, View convertView, ViewGroup parent) {
        View row = LayoutInflater.from(parent.getContext()).inflate(R.layout.custom_spinner, parent, false);
        final TextView label=(TextView)row.findViewById(R.id.tv_spinnervalue);
        label.setText(objects[position]);
        return row;
    }
    }

이것은 스피너를 클릭 한 후 모든 항목에 대한 men_icon 이미지를 줬습니다. 스피너를 클릭 한 후 men_icon 이미지 (또는 기타 사용자 정의)가 모든 행에 나타나지 않게하려면 "getDropDownView"재정의를 제거하십시오.
Brettins 2019

2

이것은 나를 위해 일했다 :

ArrayAdapter<String> adapter = new ArrayAdapter<String>(getActivity(),R.layout.simple_spinner_item,areas);
            Spinner areasSpinner = (Spinner) view.findViewById(R.id.area_spinner);
            areasSpinner.setAdapter(adapter);

내 레이아웃 폴더에서 다음을 만들었습니다 simple_spinner_item.

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/text1"
android:layout_width="match_parent"
// add custom fields here 
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:gravity="center_vertical"
android:paddingStart="?android:attr/listPreferredItemPaddingStart"
android:paddingEnd="?android:attr/listPreferredItemPaddingEnd"
android:minHeight="?android:attr/listPreferredItemHeightSmall"
android:paddingLeft="?android:attr/listPreferredItemPaddingLeft"
android:paddingRight="?android:attr/listPreferredItemPaddingRight" />

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.