Question

I have a weird problem going on with defining two separate custom XML button definitions. I created a test project solely to replicate the error, so I’ll be adding the full code and screenshots of the problem. Basically, I’d like to use 9-patch images to define custom XML button configurations that can be reused.

I’ve defined two XML files:

z_btn_xml_glossy_blue_lightblue.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector
    xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:state_focused="true"
        android:drawable="@drawable/z_btn_glossy_lightblue" >
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </item>

    <item
        android:state_pressed="true"
        android:drawable="@drawable/z_btn_glossy_lightblue" >
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />        
    </item>

    <item
        android:drawable="@drawable/z_btn_glossy_blue" >
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />        
    </item>
</selector>

z_btn_xml_glossy_black_white.xml:

<?xml version="1.0" encoding="utf-8"?>
<selector
    xmlns:android="http://schemas.android.com/apk/res/android">

    <item
        android:state_focused="true"
        android:drawable="@drawable/z_btn_glossy_white" >
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </item>

    <item
        android:state_pressed="true"
        android:drawable="@drawable/z_btn_glossy_white" >
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />        
    </item>

    <item
        android:drawable="@drawable/z_btn_glossy_black" >
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />        
    </item>
</selector>

As you can see, both of these files are essentially the exact same, but using different drawables. My main.xml layout file is:

<?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:paddingLeft="5dip"
    android:paddingRight="5dip"
    android:paddingTop="0dip"
    android:paddingBottom="3dip" >
    <Button
        android:id="@+id/BTNHostWaitingStartGame"
        android:background="@drawable/z_btn_xml_glossy_blue_lightblue"
        android:textColor="#FFFFFF"
        android:textSize="18sp"
        android:layout_marginRight="2dip"
        android:layout_width="wrap_content"
        android:layout_height="45dip"
        android:layout_weight="1.0"
        android:text="Start Game" />
    <Button
        android:id="@+id/BTNHostWaitingCancelGame"
        android:background="@drawable/z_btn_xml_glossy_black_white"
        android:textColor="#FFFFFF"
        android:textSize="18sp"
        android:layout_marginLeft="2dip"
        android:layout_width="wrap_content"
        android:layout_height="45dip"
        android:layout_weight="1.0"
        android:text="Cancel Game" />
</LinearLayout>

Pretty simplistic, it just creates two buttons. I won’t post the test activity file because all it does is set the layout to R.layout.main.

Here is a screenshot of the Graphical Layout within Eclipse, which looks like what I want the buttons to look like:

However, on the emulator, it looks like the following:

As you can see, the second button is not being styled. Can anyone shed light on why this is? It is the same on devices as well. Is there some limitation here that I’m just not aware of or not seeing?

Thanks for the help!

Answer 1

It works on my machine.

I took your code and placed the selector xml’s in res/drawable. Assuming drawable references in items are images (for example that z_btn_glossy_lightblue refers to res/drawable-hdpi/z_btn_glossy_lightblue.png), I exchanged these references to some images of my own. Works like a charm.

Try:

• Make sure you have placed your xml’s
  in the right folder, and make sure
  there are no copies of these files
  mistakenly placed in another folder.
• Make sure your the drawables you
  refer to in the items do not have any
  namesakes, for example res/drawable/z_btn_glossy_lightblue.xml
• Test referring to other images that you know work in
  other buttons.