Android Studio 学习记录

编程入门行业动态更新时间:2024-10-12 03:16:59

Android Studio 学习记录

图形Drawable

形状图形

1.shape（形状）

2.size（尺寸）

3.stroke（描边）

4.corners（圆角）

5.solid（填充）

6.padding（间隔）

7.gradient（渐变）

九宫格图片

状态列表图形

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

图形Drawable

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

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

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

基本上，分辨率每加大一级，宽度和高度就要增加二分之一或三分之一像素。如果各目录存在同名图片，Android就会根据手机的分辨率分别适配对应文件夹里的图片。在开发App时，为了兼容不同的手机屏幕，在各目录存放不同分辨率的图片，才能达到最合适的显示效果。

在XML布局文件中引用图形文件可使用“@drawable/不含拓展名的文件名称”这种形式。

形状图形

Shape图形又称形状图形，用来描述常见的几何形状，包括矩形、圆角矩形、圆形椭圆等。用好形状图形可以让App页面不再呆板，还可以减少美工不少工作量。

形状图形定义文件放在drawable目录下，它是以shape标签为根节点的XML描述文件。根节点下定义了6个节点，分别是size（尺寸）、stroke（描边）、corners（圆角）、solid（填充）、padding（间隔）、gradient（渐变），各节点的属性值主要是宽和高、半径、角度及颜色等。下面是形状图形各个节点及其属性的简要说明。

1.shape（形状）

shape是形状图形文件的根节点，它描述了当前是哪种几何图形。下面是shape节点的常用属性说明。

shape：字符串类型，表示图形的形状。形状类型的取值说明见表。

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

渐变类型的取值说明
渐变类型	说明
linear	线性渐变，默认值
radial	放射渐变，起始颜色就是圆心颜色
sweep	滚动渐变，即一个线段以某个断点为圆心做360°旋转

centerX：浮点型，圆心的X坐标。当android：type=“linear”时不可用。
centerY：浮点型，圆心的Y坐标。当android：type=“linear”时不可用。
gradientRadius：整型，渐变的半径。当android：type=“radius”时需要设置该属性。
centerColor：颜色类型，渐变的中间颜色·。
startColor：颜色类型，渐变的起始颜色·。
endColor：颜色类型，渐变的终止颜色·。
useLevel：布尔类型，设置为true为无渐变色，false为有渐变色。

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

接下来演示以下形状图形的界面效果，首先右击drawable目录，并依次选择右键菜单的New→Drawable resource file，在弹窗中输入文件名称再单击OK按钮，即可自动生成一个XML描述文件。往该文件填入下面的圆角矩形内容定义：

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

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

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

再来一个椭圆的XML描述文件，示例代码如下：

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

九宫格图片

将某张图片设置成视图背景时，如果图片尺寸太小，则系统会自动拉伸图片使之填满背景。可是一旦图片拉得过大，其画面容易变得模糊。

为了解决这个问题，Android专门设计了点九图片。点九图片的拓展名是.png，文件名后面常带有“.9.”字样。因为该图片3 X 3的九宫格区域，所以得名点九图片，也叫作九宫格图片。如果背景是一个形状图形，其stroke节点的width属性已经设置了固定数值（如1dp），那么无论该图形被拉到多大，描边宽度始终是1dp。九宫格图片的实现原理与之类似，即拉伸图形时，只拉伸内部区域，不拉伸边缘线条。

为了演示九宫格图片的展示效果，利用Android Studio制作一张点九图片。首先再drawable目录下找到代加工的原始图片button.png，右击它弹出右键菜单。

选择菜单下的Create 9-Patch files... 并再随后弹出的对话框中单击OK按钮。接着drawable目录自动生成一个名为“button.9.png”的图片，双击该文件，主界面右侧弹出点九图片的加工窗口。

图片的左侧窗口是图片加工区域，右侧窗口是图片预览区域，从上到下依次是纵向拉伸预览、横向拉伸预览、两方向同时拉伸预览。再左侧窗口图片四周的马赛克出单击会出现一个黑点，把黑点左右上下拖动会拖出一段黑线，不同方向上的黑线表示不同的效果。

如图，界面上边的黑线指的是水平方向的拉伸区域。在水平方向拉伸图片时，只有黑线区域内的图像会被拉伸，黑线以外的图像保持原状，从而保证左右两侧的边框厚度不变。

如图，界面左边的黑线指的是垂直方向的拉伸区域。在垂直方向拉伸图片时，只有黑线区域内的图像会被拉伸，黑线以外的图像保持原状，从而保证上下两侧的边框厚度不变。

如图，界面下边的黑线指的是该图片作为控件背景时，控件内部的文字左右边界只能放在黑线区域内。这里Horizontal Padding的效果相当于android:paddingLeft与android:paddingRight。

如图，界面右边的黑线指的是该图片作为控件背景时，控件内部的文字上下边界只能放在黑线区域内。这里Vertical Padding的效果相当于android:paddingTop与android:paddingBottom。

注意
如果点九图片被设置为视图背景，且该图片指定了Horizontal Padding和Vertical Padding那么视图内部将一直与视图边缘保持固定间距，无论怎么调整XML文件和Java代码都无法缩小间隔，缘由是点九图片早已在水平和垂直方向都设置了padding。

状态列表图形

常见的图形文件一般为静态图形，但有时会用到动态图形，比如按钮控件的背景在正常情况下是凸起的,再按下时是凹陷的，从按下到弹起的过程，用户便知道点击了该按钮。根据不同的触摸情况更变图形的状态，这种情况用到了Drawable的一个子类StateListDrawable（状态列表图形），它在XML文件中规定了不同状态所呈现的图形列表。

接下来演示一下状态列表图形的界面效果，右击drawable目录，并依次选择右键菜单的New→Drawable resource file,在弹窗中输入文件名称再单击OK按钮，即可自动生成一个XML描述文件，往该文件填入下面的状态列表图形定义：

<selector xmlns:android=""><item android:state_pressed="true"><shape><!--指定了形状内部的填充颜色--><solid android:color="#ffdd66"/><!-- 指定了形状轮廓的粗细与颜色 --><strokeandroid:width="1dp"android:color="#aaaaaa" /><!-- 指定了形状四个圆角的半径 --><corners android:radius="10dp" /><gradientandroid:type="linear"android:angle="90"android:startColor="#001278"android:endColor="#0194D8"/></shape></item><item ><shape><!--指定了形状内部的填充颜色--><solid android:color="#ffdd66"/><!-- 指定了形状轮廓的粗细与颜色 --><strokeandroid:width="1dp"android:color="#aaaaaa" /><!-- 指定了形状四个圆角的半径 --><corners android:radius="10dp" /><gradientandroid:type="linear"android:angle="90"android:startColor="#031EB6"android:endColor="#81CFF3"/></shape></item></selector>

上述XML文件的关键点是state_pressed属性，该属性表示按下状态，值为true表示按下时显示状态1，其余显示状态2。

状态列表图形不仅用于按钮控件，还可以用于其他拥有多种状态的控件，这取决于开发者在XML文件中指定了哪种状态类型。各种状态类型的取值说明详见表。

状态类型的取值说明
状态类型的属性名称	说明	适用的控件
state_pressed	是否按下	按钮Button
state_checked	是否勾选	复选框CheckBox、单选按钮RadioButton
state_focused	是否获取焦点	文本编辑框EditText
state_selected	是否选中	各控件通用