[Android UI]shapeとselectorの併用
10792 ワード
shapeとselectorはAndroid UIのデザインでよく使われています.例えば、フィレットButtonをカスタマイズしたり、Buttonをクリックしたりすると効果の変化があります.shapeとselectorを使用します.このようにshapeとselectorの美化コントロールにおける役割は極めて重要であると言える.
1.Shapeプロファイルの役割:XMLで定義されたジオメトリの場所:res/drawable/ファイルの名前.xml使用方法:Javaコード中:R.drawable.ファイル名XML:Android:background="@drawable/ファイル名"属性:Android:shape=["rectangle"|"oval"|"line"|"ring"]ここでrectagle矩形、oval楕円、line水平直線、ringリング中性子ノードの一般的なプロパティ:グラデーションAndroid:startColor開始色Android:endColor終了色Android:angleグラデーション角度、0は上から下、90は左から右、数値45の整数倍デフォルトは0を表します.Android:typeグラデーションのスタイルlinerリニアグラデーションradialリンググラデーションsweepフィラーAndroid:colorフィラーの色ストロークAndroid:widthストロークの幅Android:colorストロークの色Android:dashWidthで'-'横線の幅Android:dashGapで'-'横線の間の距離フィレットAndroid:radiusフィレットの半径値大角越円Android:topRightRadius右上フィレット半径Android:bottomLeftRadius右下フィレット角半径Android:topLeftRadius左上フィレット半径Android:bottomRightRadius左下フィレット半径
2.Selectorプロフィールの場所:res/drawable/ファイルの名前.xml使用方法:Javaコード中:R.drawable.ファイル名XML中:Android:background="@drawable/ファイルの名前"
3:shape+selector総合使用例
1.Shapeプロファイルの役割:XMLで定義されたジオメトリの場所:res/drawable/ファイルの名前.xml使用方法:Javaコード中:R.drawable.ファイル名XML:Android:background="@drawable/ファイル名"属性:
2.Selectorプロフィールの場所:res/drawable/ファイルの名前.xml使用方法:Javaコード中:R.drawable.ファイル名XML中:Android:background="@drawable/ファイルの名前"
<?xml version="1.0" encoding="utf-8" ?>
<selector xmlns:Android="http://schemas.android.com/apk/res/android">
<!-- -->
<item Android:drawable="@drawable/pic1" />
<!-- -->
<item
Android:state_window_focused="false"
android:drawable="@drawable/pic_blue"/>
<!-- -->
<item
Android:state_focused="true"
android:state_pressed="true"
android:drawable= "@drawable/pic_red"/>
<!-- -->
<item
Android:state_focused="false"
Android:state_pressed="true"
Android:drawable="@drawable/pic_pink"/>
<!-- -->
<item
Android:state_selected="true"
android:drawable="@drawable/pic_orange“/>
<!-- -->
<item
Android:state_focused="true"
Android:drawable="@drawable/pic_green"/>
</selector>
3:shape+selector総合使用例
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:Android="http://schemas.android.com/apk/res/android">
<item Android:state_selected="true">
<shape>
<gradient Android:angle="270" android:endColor="#99BD4C"
android:startColor="#A5D245" />
<size Android:height="60dp" android:width="320dp" />
<corners android:radius="8dp" />
</shape>
</item>
<item Android:state_pressed="true">
<shape>
<gradient Android:angle="270" android:endColor="#99BD4C"
android:startColor="#A5D245"/>
<size Android:height="60dp" android:width="320dp" />
<corners android:radius="8dp" />
</shape>
</item>
<item>
<shape>
<gradient Android:angle="270" android:endColor="#A8C3B0"
android:startColor="#C6CFCE" />
<size Android:height="60dp" android:width="320dp" />
<corners android:radius="8dp" />
</shape>
</item>
</selector>