Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Achieving multi-line drop-down items on a <code>Spinner</code> while using a <code>Holo</code> theme isn't possible, from what I've tried. </p> <p>A workaround solution is to:</p> <ul> <li>create a style for the <code>Spinner</code> that doesn't inherit from <code>Holo</code>. This will enable multi-line drop-down items.</li> <li>Style the Spinner 'manually' so it looks like it's <code>Holo</code>-themed.</li> </ul> <p>This produces (showing closed and open states):</p> <p><img src="https://i.stack.imgur.com/zaH0U.png" alt="enter image description here"></p> <p>Details of implementation:</p> <p>There is no way to inherit from a <code>Holo</code> theme on the <code>Spinner</code> and show multiple lines in the <code>Spinner</code> drop-down item as far as I can tell, even if we set the drop-down item's <code>TextView</code> <code>singleLine</code> attribute to <code>false</code> and supply a custom layout. I've also tried keeping the <code>Holo</code> style but altering the </p> <pre><code>android:spinnerStyle android:spinnerItemStyle android:spinnerDropDownItemStyle </code></pre> <p>styles attributes (example of using these attributes <a href="https://stackoverflow.com/questions/13703233/style-android-spinner/13902362#13902362">here</a>) but I couldn't make it produce a multi-line result.</p> <p>However, if we override the style for the <code>Spinner</code> and don't inherit <code>spinnerStyle</code> from <code>Holo</code>:</p> <pre><code> &lt;style name="AppTheme" parent="android:Theme.Holo.Light"&gt; &lt;item name="android:spinnerStyle"&gt;@style/spinnerStyle&lt;/item&gt; &lt;/style&gt; &lt;--no parent attribute--&gt; &lt;style name="spinnerStyle"&gt; &lt;item name="android:clickable"&gt;true&lt;/item&gt; &lt;/style&gt; </code></pre> <p>then the drop-down item will support showing multiple lines. But now we have lost the <code>Holo</code> theme on the <code>Spinner</code> and the closed state looks like a <code>TextView</code> not a <code>Spinner</code> with no arrow or visual clue it's a <code>Spinner</code>. If we instead set <code>spinnerStyle</code> parent to: <code>parent="android:style/Widget.Spinner</code>:</p> <pre><code>&lt;style name="spinnerStyle" parent="android:style/Widget.Spinner"&gt; &lt;item name="android:clickable"&gt;true&lt;/item&gt; &lt;/style&gt; </code></pre> <p>the <code>Spinner</code> closed state will show the arrow but will be styled like the grey pre-Holo <code>Spinner</code> which looks out of place in a <code>Holo</code> app. </p> <p>So, a possible solution is then:</p> <ul> <li><b>Override the theme for <code>spinnerStyle</code> and don't use <code>Holo</code> for parent.</b> This will enable multi-line text in the DropDown items.</li> <li><b>Change the <code>Spinner</code> background to look like it inherits the <code>Holo</code> theme.</b></li> </ul> <p>Here's an example:</p> <p>Create a basic Activity:</p> <pre><code>@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Spinner spinner = (Spinner)findViewById(R.id.styled_spinner); spinner.setAdapter(ArrayAdapter.createFromResource(this, R.array.items, R.layout.spinner_item)); } </code></pre> <p>Activity layout:</p> <pre><code>&lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="50dip" tools:context=".MainActivity" &gt; &lt;Spinner android:id="@+id/styled_spinner" android:layout_width="match_parent" android:layout_height="wrap_content"/&gt; &lt;/LinearLayout&gt; </code></pre> <p>styles:</p> <pre><code>&lt;resources xmlns:android="http://schemas.android.com/apk/res/android"&gt; &lt;style name="AppTheme" parent="android:Theme.Holo.Light"&gt; &lt;item name="android:spinnerStyle"&gt;@style/spinnerStyle&lt;/item&gt; &lt;/style&gt; &lt;style name="spinnerStyle"&gt; &lt;item name="android:clickable"&gt;true&lt;/item&gt; &lt;item name="android:background"&gt;@drawable/spinner_background_holo_light&lt;/item&gt; &lt;/style&gt; &lt;/resources&gt; </code></pre> <p>in drawable folder, place spinner_background_holo_light:</p> <pre><code>&lt;selector xmlns:android="http://schemas.android.com/apk/res/android"&gt; &lt;item android:state_enabled="false" android:drawable="@drawable/spinner_disabled_holo_light" /&gt; &lt;item android:state_pressed="true" android:drawable="@drawable/spinner_pressed_holo_light" /&gt; &lt;item android:state_pressed="false" android:state_focused="true" android:drawable="@drawable/spinner_focused_holo_light" /&gt; &lt;item android:drawable="@drawable/spinner_default_holo_light" /&gt; &lt;/selector&gt; </code></pre> <p>and include these drawables in your <code>drawables-hdpi</code> folder:</p> <p><img src="https://i.stack.imgur.com/OMy8l.png" alt="enter image description here"> spinner_default_holo_light.9.png </p> <p><img src="https://i.stack.imgur.com/O4vH0.png" alt="enter image description here"> spinner_disabled_holo_light.9.png</p> <p><img src="https://i.stack.imgur.com/ZkGIS.png" alt="enter image description here"> spinner_focused_holo_light.9.png</p> <p><img src="https://i.stack.imgur.com/E9F8T.png" alt="enter image description here"> spinner_pressed_holo_light.9.png</p> <p>This produces a spinner with <code>Holo</code>-themed closed state and multi-line items, as shown in the screenshots above.</p> <p>The drop-down items in this example are not <code>Holo</code>-themed but perhaps it's an acceptable trade-off if multi-line display of the drop down items is really important.</p> <p>In this example, <code>android:minSdkVersion</code> was set to <code>14</code> and <code>android:targetSdkVersion</code> to <code>17</code> in Manifest.</p> <p><code>Holo</code> graphics and the <code>spinner_background_holo_light.xml</code> code come from <a href="https://github.com/ChristopheVersieux/HoloEverywhere" rel="nofollow noreferrer">HoloEverywhere</a> Copyright (c) 2012 Christophe Versieux, Sergey Shatunov. See linked-to github project for license details.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload