Android开发【第5章中级控件】

方方怪

于 2024-08-08 16:25:23 发布

阅读量196

点赞数 6

分类专栏： Android应用开发文章标签： android

本文链接：https://blog.csdn.net/qq_74474809/article/details/141029093

版权

Android应用开发专栏收录该内容

7 篇文章 0 订阅

订阅专栏

声明：本文是学习B站动脑学院的Android开发教程笔记《Android开发从入门到是实战》的学习过程记录，笔记直接摘抄，或者根据自己的理解，可能会进行一些修改，如果有理解不正确的地方，请指出，本文仅用于学习记录。

47-图形Drawable_哔哩哔哩_bilibili

本节介绍Android图形的基本概念和几种常见图形的使用办法，包括：形状图形的组成结构及其具体用法、九宫格图片（点九图片）的制作过程及其适用场景、状态列表图形的产生背景及其具体用法

1.　图形定制

本节介绍Android图形的基本概念和几种常见图形的使用办法，包括：形状图形的组成结构及其具体用法、九宫格图片（点九图片）的制作过程及其适用场景、状态列表图形的产生背景及其具体用法。

1.1 图形Drawable

Android把所有能够显示的图形都抽象为Drawable类（可绘制的）。这里的图形不止是图片，还包括色块、画板、背景等。

包含图片在内的图形文件放在res目录的各个drawable目录下，其中drawable目录一般保存描述性的 XML文件，而图片文件一般放在具体分辨率的drawable目录下。例如：

drawable-ldpi里面存放低分辨率的图片（如240×320），现在基本没有这样的智能手机了。
drawable-mdpi里面存放中等分辨率的图片（如320×480），这样的智能手机已经很少了
drawable-hdpi里面存放高分辨率的图片（如480×800），一般对应4英寸～4.5英寸的手机（但不绝对，同尺寸的手机有可能分辨率不同，手机分辨率就高不就低，因为分辨率低了屏幕会有模糊的感觉）。
drawable-xhdpi里面存放加高分辨率的图片（如720×1280），一般对应5英寸～5.5英寸的手机。 drawable-xxhdpi里面存放超高分辨率的图片（如1080×1920），一般对应6英寸～6.5英寸的手机。
drawable-xxxhdpi里面存放超超高分辨率的图片（如1440×2560），一般对应7英寸以上的平板电脑。

基本上，分辨率每加大一级，宽度和高度就要增加二分之一或三分之一像素。如果各目录存在同名图片，Android就会根据手机的分辨率分别适配对应文件夹里的图片。在开发App时，为了兼容不同的手机屏幕，在各目录存放不同分辨率的图片，才能达到最合适的显示效果。例如，在drawable-hdpi放了一张背景图片bg.png（分辨率为480×800），其他目录没放，使用分辨率为480×800的手机查看该App界面没有问题，但是使用分辨率为720×1280的手机查看该App会发现背景图片有点模糊，原因是Android 为了让bg.png适配高分辨率的屏幕，强行把bg.png拉伸到了720×1280，拉伸的后果是图片变模糊了。

在XML布局文件中引用图形文件可使用“@drawable/不含扩展名的文件名称”这种形式，如各视图的 background属性、ImageView和ImageButton的src属性、TextView和Button四个方向的drawable*** 系列属性都可以引用图形文件。

1.2 形状图形

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

1．shape（形状）

shape是形状图形文件的根节点，它描述了当前是哪种几何图形。下面是shape节点的常用属性说明。 shape：字符串类型，表示图形的形状。形状类型的取值说明见表5-1

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：字符串类型，渐变类型。渐变类型的取值说明见表5-2。

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根节点的属性一般不用设置（默认矩形即可）。接下来演示一下形状图形的界面效果，首先右击drawable目录，并依次选择右键菜单的 New→Drawable resource file，在弹窗中输入文件名称再单击OK按钮，即可自动生成一个XML描述文件。往该文件填入下面的圆角矩形内容定义：src\main\res\drawable\shape_rect_gold.xml

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

接着创建一个测试页面，并在页面的XML文件中添加名为v_content的View标签，再给Java代码补充以下的视图背景设置代码：DrawableShapeActivity.java

// 从布局文件中获取名为v_content的视图
View v_content = findViewById(R.id.v_content);
// v_content的背景设置为圆角矩形
v_content.setBackgroundResource(R.drawable.shape_rect_gold);

然后运行测试App，观察到对应的形状图形如图5-1所示。该形状为一个圆角矩形，内部填充色为土黄色，边缘线为灰色。再来一个椭圆的XML描述文件示例如下：（src\main\res\drawable\shape_oval_rose.xml）

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

把前述的视图对象v_content背景改为R.drawable.shape_oval_rose，运行App观察到对应的形状图形如图5-2所示。该形状为一个椭圆，内部填充色为玫红色，边缘线为灰色。

DrawableShapeActivity.java完整代码：

package com.dongnaoedu.chapter05;

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);
    }

    @Override
    public void onClick(View v) {
        switch (v.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;
        }
    }
}