您的位置:首页 > 移动开发 > Android开发

【Android】Android图形之shape使用

2012-12-30 16:55 295 查看
首先用代码画出一个填充红色的矩形:



package com.msi.manning.chapter9.SimpleShape;

import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.RectShape;
import android.os.Bundle;
import android.view.View;

public class SimpleShape extends Activity {

@Override
protected void onCreate(Bundle icicle) {
super.onCreate(icicle);
setContentView(new SimpleView(this));
}

private static class SimpleView extends View {

private ShapeDrawable mDrawable = new ShapeDrawable();

public SimpleView(Context context) {
super(context);
setFocusable(true);
this.mDrawable = new ShapeDrawable(new RectShape());
this.mDrawable.getPaint().setColor(0xFFFF0000);
}

@Override
protected void onDraw(Canvas canvas) {

int x = 10;
int y = 10;
int width = 300;
int height = 50;
this.mDrawable.setBounds(x, y, x + width, y + height);
this.mDrawable.draw(canvas);
y += height + 5;

}
}
}


再如下图:



通过布局文件来设置:

第一副图shape_1.xml

实体solid为黑色,描边stroke为白色。

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
type="oval" >
<solid android:color="#00000000"/>
<padding android:left="10sp" android:top="4sp" android:right="10sp" android:bottom="4sp" />
<stroke android:width="1dp" android:color="#FFFFFFFF"/>
</shape>
第二幅图line.xml  为一条线
实体和描边都是白色,高度23dip  其中type="line"

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" type="line" >
<solid android:color="#FFFFFFFF"/>
<stroke android:width="1dp" android:color="#FFFFFFFF"
android:dashWidth="1dp" android:dashGap="2dp" />
<padding android:left="1dp" android:top="25dp"
android:right="1dp" android:bottom="25dp" />

<size android:height="23dp" />
</shape>


第三幅图shape_2.xml

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

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#FF0000FF"/>
<stroke android:width="4dp" android:color="#FFFFFFFF"
android:dashWidth="1dp" android:dashGap="2dp" />
<padding android:left="7dp" android:top="7dp"
android:right="7dp" android:bottom="7dp" />
<corners android:radius="4dp" />
</shape>


第四幅图shape_3.xml
shape类型type="oval"为椭圆

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" type="oval">
<solid android:color="#FFE1E1E1"/>
<stroke android:width="4dp" android:color="#99000000"
android:dashWidth="4dp" android:dashGap="2dp" />
<padding android:left="7dp" android:top="7dp"
android:right="7dp" android:bottom="18dp" />
<corners android:radius="12dp" />
</shape>


第五幅图和第二幅相同是一条高23dp的线

第六幅图shape_4.xml

渐变与圆角

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" type="rectangle">
<gradient android:startColor="#FFE1E1E1" android:endColor="#FFFFFFFF" android:angle="270"/>
<corners android:bottomLeftRadius="7dp"
android:bottomRightRadius="7dp"
android:topLeftRadius="1dp"
android:topRightRadius="1dp"
/>
</shape>


第七幅图shape_5.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" type="oval">
<gradient android:startColor="#FFFF0000" android:endColor="#80FF00FF"  android:angle="270"/>
<padding android:left="7dp" android:top="7dp"
android:right="7dp" android:bottom="7dp" />

</shape>


<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<ImageView android:layout_width="fill_parent"
android:layout_height="50dip"
android:src="@drawable/shape_1" />
<ImageView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="@drawable/line" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="50dip"
android:src="@drawable/shape_2" />
<!-- <ImageView-->
<!-- android:layout_width="fill_parent"-->
<!-- android:layout_height="wrap_content"-->
<!-- android:src="@drawable/line" />-->
<ImageView
android:layout_width="fill_parent"
android:layout_height="50dip"
android:src="@drawable/shape_3" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="@drawable/line" />
<ImageView
android:layout_width="fill_parent"
android:layout_height="50dip"
android:src="@drawable/shape_4" />
<!-- <ImageView-->
<!-- android:layout_width="fill_parent"-->
<!-- android:layout_height="wrap_content"-->
<!-- android:src="@drawable/line" />-->
<ImageView
android:layout_width="fill_parent"
android:layout_height="50dip"
android:src="@drawable/shape_5" />
</LinearLayout>
</ScrollView>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: