Use of Shape Drawable in Android Drawable Resources

Keywords: Android xml encoding Java

I. Introduction

Shape is an XML file that defines geometric shapes, including colors and gradients, and so on. Used as background and fill color of control.

File location: res/drawable/filename.xml

French:


    <?xml version="1.0" encoding="utf-8"?>
    <shape
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:shape=["rectangle" | "oval" | "line" | "ring"] >
        <corners
            android:radius="integer"
            android:topLeftRadius="integer"
            android:topRightRadius="integer"
            android:bottomLeftRadius="integer"
            android:bottomRightRadius="integer" />
        <gradient
            android:angle="integer"
            android:centerX="float"
            android:centerY="float"
            android:centerColor="integer"
            android:endColor="color"
            android:gradientRadius="integer"
            android:startColor="color"
            android:type=["linear" | "radial" | "sweep"]
            android:useLevel=["true" | "false"] />
        <padding
            android:left="integer"
            android:top="integer"
            android:right="integer"
            android:bottom="integer" />
        <size
            android:width="integer"
            android:height="integer" />
        <solid
            android:color="color" />
        <stroke
            android:width="integer"
            android:color="color"
            android:dashWidth="integer"
            android:dashGap="integer" />
    </shape>


Two, detailed explanation

1. shape root attributes (rectangle, oval, line, ring)

     android:shape=["rectangle" | "oval" | "line" | "ring"]   
By default, rectangle, oval, line and ring can be set.


2. Corners set rounded corners only when android: shape = rectangle is used

     <corners
android:radius="dimension"// all rounded radius
android:topLeftRadius="dimension"//radius of the upper left corner
android:topRightRadius="dimension"//radius of the upper right corner
android:bottomLeftRadius="dimension"//radius of the lower left corner
Android: bottomRightRadius= "dimension"/>// radius of the lower right corner


3. solid Setting Internal Filling Colors

     <solid android:color="color"/>


4. gradient Sets gradient to Define Two-color gradient and Three-color gradient, and gradient Style

     <gradient  
Android: type=["linear"|"radial"|"sweep"]// Linear Gradient (default), Radiation Gradient, Scanning Gradient
android:angle="integer"// gradient angle, must be 45 times, 0 from left to right, 90 from top to bottom.
android:centerX="float"// Gradient Center X at the appropriate location, ranging from 0 to 1
android:centerY="float"//Gradient center Y in a range of 0-1
android:startColor="color" // Gradient Start Color
android:centerColor="color"//Gradient midpoint color
android:endColor="color"//Gradient Endpoint Color
android:gradientRadius="float"// radius of gradient, which can only be used when the gradient type is radial.
Android: useLevel=["true"|"false"]/>// Set to true when using LevelListDrawable. When set to false, the gradient effect occurs.


5. stroke. Setting the edge attributes can define the width, color, dotted and solid lines of the edge.

     <stroke        
Android: width = dimension // width of stroke
android:color="color"//border color
android:dashWidth="dimension"//width of dashed line, solid line when value is 0.
Android: dashGap = dimension /> // dashed line interval

6. Size is used to set the size of a graph

     <size   
         android:width="dimension"   
         android:height="dimension" />

7. padding is used to set the distance between view content and boundary

    <padding    
        android:left="dimension"   
        android:top="dimension"   
        android:right="dimension"   
        android:bottom="dimension" />

Three, example

1. XML file gradient_box.xml defining shape

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

2. Add this XML file to a View

<TextView
    android:background="@drawable/gradient_box"
    android:layout_height="wrap_content"
    android:layout_width="wrap_content" />

3. Get shape drawable using java code and add it to View

Resources res = getResources();
Drawable shape = res. getDrawable(R.drawable.gradient_box);

TextView tv = (TextView)findViewByID(R.id.textview);
tv.setBackground(shape);



Posted by bizerk on Wed, 02 Jan 2019 15:18:09 -0800