[Android Development Notes] adds a border style effect to the background image of the Button,

[Android Development Notes] adds a border style effect to the background image of the Button,

The current project encountered a problem. Only one status is provided for the image, but two statuses are required. The other is the image background and border.

ImageViewButton is not very effective when you use ImageView;

 

Later, we found that layer-list can achieve this well. First, we should create xml files in the normal mode and selected mode respectively:

Normal Mode: btn_angle_normal_bg.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="rectangle">    <solid android:color="@color/transparent_half" />    <stroke        android:width="@dimen/dimen_6px"        android:color="@color/transparent_half" />    <padding        android:bottom="0.0dip"        android:left="0.0dip"        android:right="0.0dip"        android:top="0.0dip" /></shape>

Selected mode: btn_angle_bg.xml

<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="rectangle">    <solid android:color="@color/transparent_half" />    <stroke        android:width="@dimen/dimen_6px"        android:color="@color/gold" />    <padding        android:bottom="0.0dip"        android:left="0.0dip"        android:right="0.0dip"        android:top="0.0dip" /></shape>

 

Selector :common_recangle_bg.xml

<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android">    <item android:drawable="@drawable/btn_angle_bg" android:state_pressed="true" />    <item android:drawable="@drawable/btn_angle_bg" android:state_selected="true" />    <item android:drawable="@drawable/btn_angle_normal_bg" android:state_enabled="true" /></selector>

 

Layer-list file: zhuang_btn.xml

<? Xml version = "1.0" encoding = "UTF-8"?> <Layer-list xmlns: android = "http://schemas.android.com/apk/res/android"> <item android: drawable = "@ drawable/common_recangle_bg"/> // The xml file of normal and press <item android: bottom = "@ dimen/dimen_4px" android: drawable = "@ mipmap/bai_table_zhuang_up" // The background image android: left = "@ dimen/dimen_4px" android: right = "@ dimen/dimen_4px" android: top = "@ dimen/dimen_4px"/> </layer-list>

 

Then use the following internal controls in the layout:

 <Button            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center"            android:background="@drawable/zhuang_btn"            android:gravity="bottom|center"            android:text="4545\n"            android:textSize="@dimen/dimen_tv_20" />

 

Basically, this effect can be achieved!