安卓基础学习 Day 28|绘制文本、图形与图像

小鲁不吃猪蹄

已于 2022-07-20 12:47:23 修改

阅读量626

点赞数

分类专栏：安卓编程基础文章标签： android 学习

于 2022-07-19 20:12:48 首次发布

本文链接：https://blog.csdn.net/m0_64018773/article/details/125873112

版权

安卓编程基础专栏收录该内容

23 篇文章 3 订阅

订阅专栏

通过布局资源配置文件设计用户画面

图形Drawable

Drawable类型表达了各种各样的图形，包括图片、色块、画板、背景等
包含图片在内的图形文件放在res目录的各个drawable目录下，其中drawable目录一般保存描述性的XML文件，
而图片文	件一般放在具体分辨率的drawable目录下。
各视图的background属性、lmageView 和ImageButton的src属性、
TextView和Button四个方向的drawable***系列属性都	可以引用图形文件。

形状图形

Shape图形又称形状图形，它用来描述常见的几何形状，包括矩形、圆角矩形、圆形、椭圆等。
用好形状图形可以让app页面不再呆板，还可以节省美工不少工作量。
形状图形的定义文件放在drawable目录下，它是以shape标签为根节点的XML描述文件。
根节点下定义了6个节点，分别是: size(尺寸) 、stroke (描边) 、corners(圆角) 、 solid(填充) 、
 padding (间隔)、gradient(渐变)，各节点的属性值主要是长宽、半径、角度以及颜色等。

1.形状 shape

形状图形的定义文件是以shape标签为根节点的XML描述文件，它支持四种类型的形状：

rectangle:矩形。【默认值】
oval:椭圆。【此时corners节点会失效】
line:直线。【此时必须设置stroke节点,不然会报错】
ring:圆环

2.尺寸 size

size是shape的下级节点，它描述了形状图形的宽高尺寸。若无size节点，则表示宽高与宿主视图一样大小。下面是size节点的常用属性说明：

height:像素类型，图形高度。
width:像素类型，图形宽度。

3.描边 stroke

stroke是shape的下级节点，它描述了形状图形的描边规格。若无stroke节点，则表示不存在描边。下面是stroke节点的常用属性说明：

color:颜色类型，描边的颜色。
dashGap:像素类型，每段虚线之间的间隔。
dashWidth:像素类型，每段虚线的宽度。【若dashGap和dashWidth有一个值为0，则描边为实线。】
width:像素类型，描边的厚度。

4.圆角 corners

corners是shape的下级节点，它描述了形状图形的圆角大小。若无corners节点，则表示没有圆角。下面是corners节点的常用属性说明：

bottomLeftRadius:像素类型，左下圆角的半径。
bottomRightRadius:像素类型，右下圆角的半径。
topLeftRadius:像素类型，左上圆角的半径。
topRightRadius:像素类型，右上圆角的半径。
radius:像素类型，4个圆角的半径(若有上面4个圆角半径的定义，则不需要radius定义)。

5. 填充 solid

solid是shape的下级节点，它描述了形状图形的填充色彩。若无solid节点，则表示无填充颜色。下面是solid节点的常用属性说明：

color:颜色类型，内部填充的颜色。

6.间隔 padding

padding是shape的下级节点，它描述了形状图形与周围边界的间隔。若无padding节点，则表示四周不设间隔。下面是padding节点的常用属性说明：

top:像素类型，与上方的间隔。
bottom:像素类型，与下方的间隔。
left:像素类型，与左边的间隔。
right:像素类型，与右边的间隔。

7.渐变 gradient

gradient是shape的下级节点，它描述了形状图形的颜色渐变。若无gradient节点，则表示没有渐变效果。下面是gradient节点的常用属性说明：

angle:整型，渐变的起始角度。为0时表示时钟的9点位置，值增大表示往逆时针方向旋转。例如，值为90表示6点位置，值为180表示3点位置，值为270表示0点/12点位置。
type:字符串类型，渐变类型。
centerx:浮点型，圆心的X坐标。当android:type="linear"时不可用。
centerY:浮点型，圆心的Y坐标。当android:type="linear"时不可用。
gradientRadius:整型，渐变的半径。当android:type="radial"时需要设置该属性。
centercolor:颜色类型，渐变的中间颜色。
startColor:颜色类型，渐变的起始颜色。
endColor:颜色类型，渐变的终止颜色。
useLevel:布尔类型，设置为true为无渐变色、false为有渐变色。

【注：在实际开发中，形状图形主要使用3个节点: stroke(描边) 、corners(圆角）和solid(填充)。至于shape根节点的属性一般不用设置(默认矩形即可)】

绘制图形

主布局资源文件

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".DrawableShapeActivity">

    <View
        android:id="@+id/v_content"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:layout_margin="10dp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btn_rect"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="圆角矩形背景" />

        <Button
            android:id="@+id/btn_oval"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="椭圆背景" />
    </LinearLayout>
</LinearLayout>

形状xml文件

圆角矩形

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <!--    指定形状内部的填充颜色-->
    <solid android:color="#FF88C2" />
    <!--    指定形状轮廓的粗细与颜色-->
    <stroke
        android:width="1dp"
        android:color="#aaaaaa" />
    <!--    指定形状四个圆角的半径-->
    <corners android:radius="30dp" />
</shape>

在这里插入图片描述

椭圆

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <!--    指定形状内部的填充颜色-->
    <solid android:color="#FF8888" />
    <!--    指定形状轮廓的粗细与颜色-->
    <stroke
        android:width="1dp"
        android:color="#aaaaaa" />
</shape>

在这里插入图片描述

主界面

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;

public class DrawableShapeActivity extends AppCompatActivity implements View.OnClickListener {

    private View v_content;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_drawable_shape);
        v_content = findViewById(R.id.v_content);
        //设置监听
        findViewById(R.id.btn_rect).setOnClickListener(this);
        findViewById(R.id.btn_oval).setOnClickListener(this);
        //v_content的背景设置为圆角矩形
        v_content.setBackgroundResource(R.drawable.shape_rect_gold);
        //v_content的背景设置为椭圆
        v_content.setBackgroundResource(R.drawable.shape_oval_rose);

    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.btn_rect:
                v_content.setBackgroundResource(R.drawable.shape_rect_gold);
                break;
            case R.id.btn_oval:
                v_content.setBackgroundResource(R.drawable.shape_oval_rose);
                break;
        }
    }
}