9

I have, for the time being, a custom view with a 9-patch image as a border.

That custom view is placed three times in a LinearLayout, so it looks like this:

+------------------------+
|  CustomView            |
+------------------------+
|  CustomView            |
+------------------------+
|  CustomView            |
+------------------------+

I have attached a click event listener to the View, so it is clickable. But then I click it, I can't see that I am clicking it - there is no change in color.

So, I'm thought that I'd attach a "onPress" listener, and then change the background of the view but I couldn't find such a listener.

So, how do I create the behaviour on the View so I can see that it is being pressed? this is normally done in Android with a green background to indicate that it is now being pressed.

halfer
  • 19,824
  • 17
  • 99
  • 186
Ted
  • 19,727
  • 35
  • 96
  • 154

2 Answers2

21

You could set the OnClickListener for the view. That will be called when the view is clicked. But for something as simple as changing the background when a view is clicked you should use a stateful drawable. They work like this, you make 3 9-patch images.

  1. is the normal background like what you have now.
  2. is what the background should look like when the user selects the view with the track-ball / d-pad
  3. is what the view should look like when the user clicks on it

Then you create an new xml file in your drawable folder. It should look like this:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:state_focused="true"
    android:state_pressed="true"
    android:drawable="@drawable/background_pressed" />
<item
    android:state_focused="true"
    android:state_pressed="false"
    android:drawable="@drawable/background_focused" />
<item
    android:state_focused="false"
    android:state_pressed="true"
    android:drawable="@drawable/background_pressed" />
<item
    android:drawable="@drawable/background_normal" />

Then, when you set the background of your view set it to the xml file.

CaseyB
  • 24,780
  • 14
  • 77
  • 112
  • Thx for that =) So, I was sort of close to the solution. Instead of trying to find a "onPress"-thing, i just create 3 different images and put them in the Selector-XML-file and then attach the Selector-XML-file as the background? I'll try that =) thx! – Ted Jan 05 '10 at 23:03
  • Hmm, on [ android:drawable="@drawable/background_pressed" ] I cannot find my drawables. If I try to replace background_pressed with my image, it doesnt show up. Am I missing something? – Ted Jan 05 '10 at 23:11
  • 1
    Hmm, it didnt work it seems... Its just as normal - no changing of the background... – Ted Jan 05 '10 at 23:19
  • Im guessing it has something to do with the fact that I dont get the suggestions when specifying android:drawable="..." – Ted Jan 05 '10 at 23:22
  • Did you add the XML in Eclipse or just into the filesystem? If you added it in the filesystem you need to refresh the eclipse folder. As for not finding the drawable, you need to make sure that the name you enter in the xml is exactly the same as the name of the image, minus the extension. And you need to be sure to set the view to be clickable and focusable. – CaseyB Jan 06 '10 at 15:53
4

In the case you might have problems to accessing colors, you might like to add colors.xml to values folder with some of your favorite colors like:

enter image description here

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <color name="background_pressed">#FFFF00</color> <!--yellow-->
 <color name="background_normal">#808000</color>    <!--olive-->
 <color name="background_focused">#0000FF</color>    <!--blue-->
</resources>

And then add another xml file to your drawable folder with whatever name you like

enter image description here

With content like previous answer but instead of @drawable you call @color

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:state_focused="true"
    android:state_pressed="true"
    android:drawable="@color/background_pressed" />
<item
    android:state_focused="true"
    android:state_pressed="false"
    android:drawable="@color/background_focused" />
<item
    android:state_focused="false"
    android:state_pressed="true"
    android:drawable="@color/background_pressed" />
<item
    android:drawable="@color/background_normal" />
</selector>

Now you could set background of your view to your drawable forlder

android:background="@drawable/background_click_state"

If you want to have all the X11/w3c color codes use this post or just codes that provided here:

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <color name="White">#FFFFFF</color>
 <color name="Ivory">#FFFFF0</color>
 <color name="LightYellow">#FFFFE0</color>
 <color name="Yellow">#FFFF00</color>
 <color name="Snow">#FFFAFA</color>
 <color name="FloralWhite">#FFFAF0</color>
 <color name="LemonChiffon">#FFFACD</color>
 <color name="Cornsilk">#FFF8DC</color>
 <color name="Seashell">#FFF5EE</color>
 <color name="LavenderBlush">#FFF0F5</color>
 <color name="PapayaWhip">#FFEFD5</color>
 <color name="BlanchedAlmond">#FFEBCD</color>
 <color name="MistyRose">#FFE4E1</color>
 <color name="Bisque">#FFE4C4</color>
 <color name="Moccasin">#FFE4B5</color>
 <color name="NavajoWhite">#FFDEAD</color>
 <color name="PeachPuff">#FFDAB9</color>
 <color name="Gold">#FFD700</color>
 <color name="Pink">#FFC0CB</color>
 <color name="LightPink">#FFB6C1</color>
 <color name="Orange">#FFA500</color>
 <color name="LightSalmon">#FFA07A</color>
 <color name="DarkOrange">#FF8C00</color>
 <color name="Coral">#FF7F50</color>
 <color name="HotPink">#FF69B4</color>
 <color name="Tomato">#FF6347</color>
 <color name="OrangeRed">#FF4500</color>
 <color name="DeepPink">#FF1493</color>
 <color name="Fuchsia">#FF00FF</color>
 <color name="Magenta">#FF00FF</color>
 <color name="Red">#FF0000</color>
 <color name="OldLace">#FDF5E6</color>
 <color name="LightGoldenrodYellow">#FAFAD2</color>
 <color name="Linen">#FAF0E6</color>
 <color name="AntiqueWhite">#FAEBD7</color>
 <color name="Salmon">#FA8072</color>
 <color name="GhostWhite">#F8F8FF</color>
 <color name="MintCream">#F5FFFA</color>
 <color name="WhiteSmoke">#F5F5F5</color>
 <color name="Beige">#F5F5DC</color>
 <color name="Wheat">#F5DEB3</color>
 <color name="SandyBrown">#F4A460</color>
 <color name="Azure">#F0FFFF</color>
 <color name="Honeydew">#F0FFF0</color>
 <color name="AliceBlue">#F0F8FF</color>
 <color name="Khaki">#F0E68C</color>
 <color name="LightCoral">#F08080</color>
 <color name="PaleGoldenrod">#EEE8AA</color>
 <color name="Violet">#EE82EE</color>
 <color name="DarkSalmon">#E9967A</color>
 <color name="Lavender">#E6E6FA</color>
 <color name="LightCyan">#E0FFFF</color>
 <color name="BurlyWood">#DEB887</color>
 <color name="Plum">#DDA0DD</color>
 <color name="Gainsboro">#DCDCDC</color>
 <color name="Crimson">#DC143C</color>
 <color name="PaleVioletRed">#DB7093</color>
 <color name="Goldenrod">#DAA520</color>
 <color name="Orchid">#DA70D6</color>
 <color name="Thistle">#D8BFD8</color>
 <color name="LightGrey">#D3D3D3</color>
 <color name="Tan">#D2B48C</color>
 <color name="Chocolate">#D2691E</color>
 <color name="Peru">#CD853F</color>
 <color name="IndianRed">#CD5C5C</color>
 <color name="MediumVioletRed">#C71585</color>
 <color name="Silver">#C0C0C0</color>
 <color name="DarkKhaki">#BDB76B</color>
 <color name="RosyBrown">#BC8F8F</color>
 <color name="MediumOrchid">#BA55D3</color>
 <color name="DarkGoldenrod">#B8860B</color>
 <color name="FireBrick">#B22222</color>
 <color name="PowderBlue">#B0E0E6</color>
 <color name="LightSteelBlue">#B0C4DE</color>
 <color name="PaleTurquoise">#AFEEEE</color>
 <color name="GreenYellow">#ADFF2F</color>
 <color name="LightBlue">#ADD8E6</color>
 <color name="DarkGray">#A9A9A9</color>
 <color name="Brown">#A52A2A</color>
 <color name="Sienna">#A0522D</color>
 <color name="YellowGreen">#9ACD32</color>
 <color name="DarkOrchid">#9932CC</color>
 <color name="PaleGreen">#98FB98</color>
 <color name="DarkViolet">#9400D3</color>
 <color name="MediumPurple">#9370DB</color>
 <color name="LightGreen">#90EE90</color>
 <color name="DarkSeaGreen">#8FBC8F</color>
 <color name="SaddleBrown">#8B4513</color>
 <color name="DarkMagenta">#8B008B</color>
 <color name="DarkRed">#8B0000</color>
 <color name="BlueViolet">#8A2BE2</color>
 <color name="LightSkyBlue">#87CEFA</color>
 <color name="SkyBlue">#87CEEB</color>
 <color name="Gray">#808080</color>
 <color name="Olive">#808000</color>
 <color name="Purple">#800080</color>
 <color name="Maroon">#800000</color>
 <color name="Aquamarine">#7FFFD4</color>
 <color name="Chartreuse">#7FFF00</color>
 <color name="LawnGreen">#7CFC00</color>
 <color name="MediumSlateBlue">#7B68EE</color>
 <color name="LightSlateGray">#778899</color>
 <color name="SlateGray">#708090</color>
 <color name="OliveDrab">#6B8E23</color>
 <color name="SlateBlue">#6A5ACD</color>
 <color name="DimGray">#696969</color>
 <color name="MediumAquamarine">#66CDAA</color>
 <color name="CornflowerBlue">#6495ED</color>
 <color name="CadetBlue">#5F9EA0</color>
 <color name="DarkOliveGreen">#556B2F</color>
 <color name="Indigo">#4B0082</color>
 <color name="MediumTurquoise">#48D1CC</color>
 <color name="DarkSlateBlue">#483D8B</color>
 <color name="SteelBlue">#4682B4</color>
 <color name="RoyalBlue">#4169E1</color>
 <color name="Turquoise">#40E0D0</color>
 <color name="MediumSeaGreen">#3CB371</color>
 <color name="LimeGreen">#32CD32</color>
 <color name="DarkSlateGray">#2F4F4F</color>
 <color name="SeaGreen">#2E8B57</color>
 <color name="ForestGreen">#228B22</color>
 <color name="LightSeaGreen">#20B2AA</color>
 <color name="DodgerBlue">#1E90FF</color>
 <color name="MidnightBlue">#191970</color>
 <color name="Aqua">#00FFFF</color>
 <color name="Cyan">#00FFFF</color>
 <color name="SpringGreen">#00FF7F</color>
 <color name="Lime">#00FF00</color>
 <color name="MediumSpringGreen">#00FA9A</color>
 <color name="DarkTurquoise">#00CED1</color>
 <color name="DeepSkyBlue">#00BFFF</color>
 <color name="DarkCyan">#008B8B</color>
 <color name="Teal">#008080</color>
 <color name="Green">#008000</color>
 <color name="DarkGreen">#006400</color>
 <color name="Blue">#0000FF</color>
 <color name="MediumBlue">#0000CD</color>
 <color name="DarkBlue">#00008B</color>
 <color name="Navy">#000080</color>
 <color name="Black">#000000</color>
</resources>
Community
  • 1
  • 1
Eftekhari
  • 1,001
  • 1
  • 19
  • 37