歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> Android 使用shape制作drawable素材

Android 使用shape制作drawable素材

日期:2017/3/1 9:21:23   编辑:Linux編程

Android開發中,資源文件中會有大量的圖片素材文件,這樣會額外增加APP的大小,有時面對對APP 大小有限制的,那就要考慮盡可能的對圖片進行壓縮處理或者減少資源文件中圖片的數量,那麼減少了資源素材文件,我們如何滿足應用對圖形的豐富要求呢?我們可以使用shape繪制的,有很多優點。從而滿足我們的要求,下面是我整理的一些素材:

首先看最終效果:

1、主布局XML文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="10dp" >

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="@drawable/s1"
android:padding="10dp"
android:text="@string/s1"
android:textColor="#fff"
android:textSize="16sp" />

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="@drawable/s2"
android:padding="10dp"
android:text="@string/s2"
android:textColor="#ff9800"
android:textSize="16sp" />

<ImageButton
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginBottom="20dp"
android:background="@drawable/s3"
android:padding="10dp"
android:scaleType="fitXY"
android:src="@drawable/ic_launcher" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="@drawable/s4"
android:padding="5dp"
android:text="@string/s4"
android:textColor="#fff"
android:textSize="16sp" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="@drawable/s5"
android:padding="5dp"
android:text="@string/s5"
android:textColor="#00bcd4"
android:textSize="16sp" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:background="@drawable/s6"
android:padding="5dp"
android:text="@string/s6"
android:textColor="#fff"
android:textSize="16sp" />

</LinearLayout>

2、shape文件

1)s1.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#23C7B2" />
<corners android:radius="8dp" />
</shape>

2)s2.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#00000000" />
<corners android:radius="8dp" />
<stroke android:width="1dp" android:color="#ff9800" />
</shape>

3)s3.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape android:shape="oval">
<solid android:color="#42A0DB" />
</shape>
</item>
<item android:state_focused="true">
<shape android:shape="oval">
<solid android:color="#42A0DB" />
</shape>
</item>
<item>
<shape android:shape="oval">
<solid android:color="#42A0DB" />
</shape>
</item>
</selector>

4)s4.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape>
<solid android:color="#7F79B5" />
<corners android:radius="8dp" />
</shape>
</item>
<item android:state_focused="true">
<shape>
<solid android:color="#7F79B5" />
<corners android:radius="8dp" />
</shape>
</item>
<item>
<shape>
<solid android:color="#7F79B8" />
<corners android:radius="8dp" />
</shape>
</item>
</selector>

5)s5.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true">
<shape>
<solid android:color="#e3e3e3" />
<corners android:radius="8dp" />
<stroke android:width="1dp" android:color="#00bcd4" />
</shape>
</item>
<item android:state_focused="true">
<shape>
<solid android:color="#e3e3e3" />
<corners android:radius="8dp" />
<stroke android:width="1dp" android:color="#00bcd4" />
</shape>
</item>
<item>
<shape>
<solid android:color="#00000000" />
<corners android:radius="8dp" />
<stroke android:width="1dp" android:color="#00bcd4" />
</shape>
</item>
</selector>

6)s6.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:state_pressed="true">
<layer-list>
<item android:top="3dp">
<shape>
<solid android:color="#00bcd4" />
<corners android:radius="8dp" />
</shape>
</item>
</layer-list>
</item>
<item android:state_focused="true">
<layer-list>
<item android:top="3dp">
<shape>
<solid android:color="#00bcd4" />
<corners android:radius="8dp" />
</shape>
</item>
</layer-list>
</item>
<item>
<layer-list>
<item>
<shape>
<solid android:color="#dddddd" />
<corners android:radius="8dp"/>
</shape>
</item>
<item android:bottom="3dp">
<shape>
<solid android:color="#00bcd4" />
<corners android:radius="8dp"/>
</shape>
</item>
</layer-list>
</item>
</selector>

3、String.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

<string name="app_name">shape制作drawable素材</string>
<string name="action_settings">Settings</string>
<string name="hello_world">Hello world!</string>
<string name="s1">我是第一行</string>
<string name="s2">我是第二行</string>
<string name="s3">我是第三行</string>
<string name="s4">我是第四行</string>
<string name="s5">我是第五行</string>
<string name="s6">我是第六行</string>

</resources>

4、主界面Activity代碼

package com.sunny.shape;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.Window;

public class MainActivity extends Activity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
}
}

以上就是使用shape制作drawable素材,代碼很詳細,就不貼源碼了,按照以上步驟操作就��以做出最終效果,也可以做出自己想要的喜歡樣式,歡迎大家一塊學習交流~

更多Android相關信息見Android 專題頁面 http://www.linuxidc.com/topicnews.aspx?tid=11

Copyright © Linux教程網 All Rights Reserved