你好,游客 登录 注册 搜索
背景:
阅读新闻

Android 使用shape制作drawable素材

[日期:2015-10-10] 来源:Linux社区  作者:sunnygeek [字体: ]

Android开发中,资源文件中会有大量的图片素材文件,这样会额外增加APP的大小,有时面对对APP 大小有限制的,那就要考虑尽可能的对图片进行压缩处理或者减少资源文件中图片的数量,那么减少了资源素材文件,我们如何满足应用对图形的丰富要求呢?我们可以使用shape绘制的,有很多优点。从而满足我们的要求,下面是我整理的一些素材:

首先看最终效果:

Android 使用shape制作drawable素材

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

本文永久更新链接地址http://www.linuxidc.com/Linux/2015-10/124008.htm

linux
本文评论   查看全部评论 (0)
表情: 表情 姓名: 字数

       

评论声明
  • 尊重网上道德,遵守中华人民共和国的各项有关法律法规
  • 承担一切因您的行为而直接或间接导致的民事或刑事法律责任
  • 本站管理人员有权保留或删除其管辖留言中的任意内容
  • 本站有权在网站内转载或引用您的评论
  • 参与本评论即表明您已经阅读并接受上述条款