When you see the button on the main interface of Budweiser beer client, it looks novelty. First, watch the film:
Pay attention to the arrow I drew in the figure. At that time, the black circle of the mouse was clicked, and then the button was pressed (yellow stroke)
At the beginning, I was very curious to see this effect. I don't know how to implement it. Later I thought about it. The whole beer can is an image (imageview), which is placed on top of three buttons, then, set the image as inaccessible focus, that isAndroid: focusable = "false"In this way, a simple line can be done!
To verify my ideas, I created a project for testing. The results are shown in:
DetailsCodeAs follows:
Main. xml:
<? XML version = "1.0" encoding = "UTF-8"?>
<Relativelayout xmlns: Android =" Http://schemas.android.com/apk/res/android"
Android: layout_width = "fill_parent"
Android: layout_height = "fill_parent"
>
<Linearlayout
Android: layout_width = "match_parent"
Android: layout_height = "wrap_content"
Android: Orientation = "vertical">
<Button
Android: layout_width = "match_parent"
Android: layout_height = "wrap_content"
Android: layout_margin = "10dp"
Android: text = "button1"
Android: Background = "@ drawable/button_selector"
/>
<Button
Android: layout_width = "match_parent"
Android: layout_height = "wrap_content"
Android: layout_margin = "10dp"
Android: text = "button2"
Android: Background = "@ drawable/button_selector"
/>
<Button
Android: layout_width = "match_parent"
Android: layout_height = "wrap_content"
Android: layout_margin = "10dp"
Android: text = "button3"
Android: Background = "@ drawable/button_selector"
/>
</Linearlayout>
<Imageview
Android: layout_width = "wrap_content"
Android: layout_height = "wrap_content"
Android: src = "@ drawable/bg2"
Android: focusable = "false"
/>
</Relativelayout>
Button_selector.xml:
<? XML version = "1.0" encoding = "UTF-8"?>
<Selector
Xmlns: Android =" Http://schemas.android.com/apk/res/android" >
<Item Android: state_pressed = "true">
<Shape>
<! -- Solid, that is, filling -->
<Solid Android: color = "# 8470ff"/>
<! -- Stroke -->
<Stroke
Android: width = "2dp"
Android: color = "# FFFF00"/>
<! -- Rounded corner -->
<Corners
Android: radius = "5dp"/>
<Padding
Android: Left = "10dp"
Android: Top = "10dp"
Android: Right = "10dp"
Android: Bottom = "10dp"/>
</Shape>
</Item>
<Item>
<Shape>
<! -- Solid, that is, filling -->
<Solid Android: color = "# 8470ff"/>
<Corners
Android: radius = "5dp"/>
<Padding
Android: Left = "10dp"
Android: Top = "10dp"
Android: Right = "10dp"
Android: Bottom = "10dp"/>
</Shape>
</Item>
</Selector>
If you have any questions about the use of shape in button_selector.xml, refer to my previousArticle: Use of shape in Android
Okay, that's all ......