Các thiết kế controls trong gio diện activity android như thế nào cho đẹp? Để có giao diện thân thiện đòi hỏi từng đối tuợng trên màng hình giao diện phải đuợc thiết kế thân thiện.

Trong  bài hứong dẫn này mình sẽ huớng dẫn các bạn thiết kế giao diện của 1 control thuờng dùng nhất trong lập trình viết app - Button.

Làm thế nào để tạo style cho Button?

1) Tạo file .XML trong thư mục “res/drawable” định dạng style

2) Thêm thuộc tính ở thư mục Valuse

3) Thêm thuộc tính ở code .xml của control 

style=”@style/btnStyleOrange”

Tham khảo một số mẫu Style Buton:

1. Orange

?

Selector XML : custom_btn_orange.xml (Add XML to res/drawable folder)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
     <item android:state_pressed="true" >
         <shape android:shape="rectangle"  >
             <corners android:radius="3dip" />
             <stroke android:width="1dip" android:color="#c53e2b" />
             <gradient  android:angle="-90"  android:startColor="#a11005" android:endColor="#d62608"  />           
         </shape>
     </item>
    <item android:state_focused="true">
         <shape android:shape="rectangle"  >
             <corners android:radius="3dip" />
             <stroke android:width="1dip" android:color="#c53e2b" />
             <solid  android:color="#e0341e"/>     
         </shape>
     </item> 
    <item >
        <shape android:shape="rectangle"  >
             <corners android:radius="3dip" />
             <stroke android:width="1dip" android:color="#c53e2b" />
             <gradient  android:angle="-90"  android:startColor="#ff6c52" android:endColor="#e0341e" />           
         </shape>
     </item>
</selector>
 

Button style : Add style code to values/styles.xml file

<style name="btnStyleOrange" parent="@android:style/Widget.Button">
       <item name="android:textSize">15sp</item>
       <item name="android:textStyle">bold</item>
       <item name="android:textColor">#FFFFFF</item>
       <item name="android:gravity">center</item>
       <item name="android:shadowColor">#000000</item>
       <item name="android:shadowDx">1</item>
       <item name="android:shadowDy">1</item>
       <item name="android:shadowRadius">0.6</item>
       <item name="android:background">@drawable/custom_btn_orange</item>
       <item name="android:padding">10dip</item>
   </style>
 

Xem thêm Custom Button Android 

Android Custom Button trong Android

Custom Button Android ( Button Styles)

Unknown 0

Xem thêm

Trong android các control đều thuộc lớp View. Như TextView, Button, EditText, . . . .Các bạn có thể tùy chình hình dạng, trang trí giao diện cho các control này như ý muốn.
Hôm này Học Lập Trình sẽ huớng dẫn các bạn 1 cách tùy chỉnh giao diện cho các control 1 cách đơn giản là include file .xml vào cho background để điều chỉnh giao diện.
Đầu tiên các bạn tạo 1 file .xml trong thư mục draw để tùy chỉnh giao diện.
Chuột phải vào thư mục Draw -> New -> File XML

Đặt tên dinhdang.xml

Thêm code sau vào:

<shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Set màu nền -->
    <solid android:color="#FACC2E">
    </solid>
    <!-- đặt thuộc tính màu và độ rộng của đường viền -->
    <stroke android:color="#0101DF" android:width="3dp">
    </stroke>
    <!-- các thuộc tính căn chỉnh -->
    <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp">
    </padding>
    <!-- và đây là bán kính đường tròn ở 4 góc -->
    <corners android:radius="400dp">
    </corners>
</shape>

Ở màng hình chính bạn thêm thuộc tính android:background="@drawable/duongvien"

Và xêm kết quả

DownLoad Source Code

Android Custom Button trong Android

Custom Button trong Android

Unknown 0

Xem thêm