【安卓基础2】简单控件

【安卓基础2】简单控件
🏆作者简介：|康有为| ，大四在读，目前在小米安卓实习，毕业入职。

🏆安卓学习资料推荐：

视频：b站搜动脑学院视频链接（他们的视频后面一部分没再更新，看看前面也挺好的）

书籍：《第一行代码》(第3版) by 郭霖 (z-lib.org)

思维导图： https://www.processon.com/view/link/62427cb2e0b34d0730e20e00（来自动脑学院）

🏆持续学习安卓知识中，共勉，我的【安卓】专栏中还有其他文章，持续更新中，欢迎关注

目录

一、文本显示

设置文本内容

设置文本大小

设置文本颜色

二、视图基础

设置视图的宽高

设置视图间距

三、常用布局

线性布局LinearLayout

orientation属性：水平排列、垂直排列

layout_weight属性：权重占比

相对布局RelativeLayout

参照物为平级视图

参照物为父级属性

网格布局GridLayout

滚动视图ScrollView

四、按钮触控

不同类型的按钮

一、文本显示

设置文本内容

先将要用的字符串写到 res/values/strings.xml 里面，然后外面就能调用这个字符串了，也可以直接在外面调用字符串，但是规范的操作还是写到strings.xml里面的。

设置文本内容有两种方式:
- 在XML文件中通过属性android:text设置文本
```
   android:text="@string/hello"
   android:text="也可以直接在这里写字符串"
```
- 在Java代码中调用文本视图对象的setText方法设置文本
```
TextView tv_hello = findViewById(R.id.tv_hello);
tv_hello.setTextSize(R.string.hello);
```
演示

1.快速创建一个Activity

2.res/values/strings.xml
```
<string name="hello">你好 世界string>
```
3. 两种方式

方式一：在layout的xml文件中
```
"1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activity_text_view">
 
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/tv_hello"
        android:text="@string/hello"
 
        />
LinearLayout>
```
方式二：在java代码中的onCreate方法里面加上
```
 
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_text_view);
    TextView tv_hello = findViewById(R.id.tv_hello);
    tv_hello.setText(R.string.hello);
}
```
设置文本大小

两种方法：

1.在XML文件中则通过属性 android:textSize指定文本大小，此时需要指定字号单位。
```
android:Size="30sp"
```
2.在Java代码中调用setTextSize方法，即可指定文本大小。
```
TextView tv_hello = findViewById(R.id.tv_hello);
tv_hello.setTextSize(30);
```
单位

px:它是手机屏幕的最小显示单位，与设备的显示屏有关。

dp:它是与设备无关的显示单位，只与屏幕的尺寸有关。

sp:它专门用来设置字体大小，在系统设置中可以调整字体大小。

设置文本颜色

两种方法

1.在XML布局文件中设置文本颜色

在XML布局文件中，你可以使用android:textColor属性为文本设置颜色。例如
```
<TextView
    android:id="@+id/myTextView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Hello, World!"
    android:textColor="#FF0000" /> 
```
2.在Java代码中调用setTextColor方法即可设置文本颜色，具体色值可从 Color类取。
```
TextView tv_hello = findViewById(R.id.tv_hello);
tv_hello.setTextColor(Color.GREEN);
```
色值有八位十六进制数与六位十六进制数两种表达方式，例如八位编码FFEEDDCC中，

表示透明度，EE表示红色的浓度，DD表示绿色的浓度，CC表示蓝色的浓度。

透明度为FF表示完全不透明，为00表示完全透明。RGB三色的数值越大表示颜色越浓,也就越亮;数值越小，表示颜色越淡，也就越暗。

二、视图基础

设置视图的宽高

视图宽度通过属性android:layout_width表达

视图高度通过属性android:layout_height表达

宽高的取值主要有下列三种:
1. match_parent:表示与上级视图保持一致，最上级的容器就是屏幕。
2. wrap_content:表示与内容自适应，也就是包裹内容。
3. 以dp为单位的具体尺寸。
方法一：在XML布局文件中设置宽高

在XML布局文件中，你可以使用android:layout_width和android:layout_height属性来设置视图的宽度和高度。例如：
```
<Button
    android:id="@+id/myButton"
    android:layout_width="100dp"
    android:layout_height="50dp"
    android:text="Click me" />
```
上面的例子中，android:layout_width和android:layout_height属性分别设置了按钮的宽度和高度为100dp和50dp。你可以根据需要修改这些值。

方法二：在Java代码中动态设置宽高

在Java代码中，你可以使用setLayoutParams方法来动态设置视图的宽度和高度。例如：
```
// 在Activity或Fragment中的Java代码中
Button myButton = findViewById(R.id.myButton);
 
// 设置宽度和高度
int widthInPixels = 200; // 宽度，以像素为单位
int heightInPixels = 100; // 高度，以像素为单位
 
ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(widthInPixels, heightInPixels);
myButton.setLayoutParams(params);
```
上述代码中，我们创建了一个ViewGroup.LayoutParams对象，并设置了宽度和高度，然后使用setLayoutParams方法将其应用到按钮上。你可以根据需要使用不同的LayoutParams类，例如RelativeLayout.LayoutParams或LinearLayout.LayoutParams，具体取决于你的布局类型。

请注意，动态设置视图宽高时，你可以选择使用像素（pixels）或者其他单位（如dp、sp等），具体取决于你的设计需求。

设置视图间距

主要有外边距和内边距两种

外边距与内边距的区别
- 外边距：layout_margin是用于控制视图与其父容器或相邻视图之间的距离，影响视图在布局中的位置。外边距定义了视图的外部空白区域，它不影响视图内部的内容。
包括layout_margin、layout_marginLeft、layout_marginTop、layout_marginRight、layout_marginBottom
- 内边距：padding是用于控制视图内部内容与视图边界之间的距离。它影响视图内部的内容区域，但不会影响视图本身在布局中的位置和大小。
包括padding、paddingLeft、paddingTop、 paddingRight、 paddingBottom

总结：控件和控件之间的距离我们称之为外边距，控件中的内容与控件之间的距离我们称之为内边距。

方法一：在XML布局文件中设置间距

在XML布局文件中，你可以使用android:layout_margin属性设置视图的外边距（margin）。android:layout_margin属性是一个四个值的集合，分别表示视图的上、下、左、右外边距。例如：
```
<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Button 1"
    android:layout_margin="16dp" />
```
上述例子中，android:layout_margin被设置为16dp，表示上、下、左、右四个方向的外边距都为16dp。你可以根据需要设置不同的值。

方法二：在Java代码中动态设置间距

在Java代码中，你可以使用setMargins方法动态设置视图的外边距。例如：
```
// 在Activity或Fragment中的Java代码中
Button button1 = findViewById(R.id.button1);
 
// 设置上、下、左、右外边距（以像素为单位）
int marginInPixels = 20;
ViewGroup.MarginLayoutParams params = (ViewGroup.MarginLayoutParams) button1.getLayoutParams();
params.setMargins(marginInPixels, marginInPixels, marginInPixels, marginInPixels);
button1.setLayoutParams(params);
```
上述代码中，我们获取了LayoutParams对象，并使用setMargins方法设置了上、下、左、右四个方向的外边距。你可以根据需要调整外边距的值和方向。

请注意，动态设置间距时，需要确保你的LayoutParams类型是MarginLayoutParams或其子类。如果使用的是RelativeLayout.LayoutParams或LinearLayout.LayoutParams等特定的LayoutParams类型，你可能需要将其转换为MarginLayoutParams。

设置视图的对齐方式

设置视图的对齐方式有两种途径:
- 采用layout_gravity属性，它指定了当前视图相对于上级视图的对齐方式。
- 采用gravity属性，它指定了下级视图相对于当前视图的对齐方式。
示例

在xml文件中
```
android:layout_gravity="right"
```
layout_gravity
- 它指定了当前视图相对于上级视图的对齐方式。
- 取值：（可以用 “|” 组合）
- left：左对齐
- right：右对齐
- top：顶部对齐
- bottom：底部对齐
- center：居中对齐
- center_vertical：垂直居中对齐
- center_horizontal：水平居中对齐
- start：起始位置（依赖于布局的方向，通常是左对齐）
- end：结束位置（依赖于布局的方向，通常是右对齐）
gravity
- 它指定了下级视图相对于当前视图的对齐方式。
- 取值：（可以用 “|” 组合）
- left：左对齐
- right：右对齐
- top：顶部对齐
- bottom：底部对齐
- center：居中对齐
- center_vertical：垂直居中对齐
- center_horizontal：水平居中对齐
- start：起始位置（依赖于布局的方向，通常是左对齐）
- end：结束位置（依赖于布局的方向，通常是右对齐）
- fill_vertical：垂直方向填充
- fill_horizontal：水平方向填充
- clip_vertical：垂直方向裁剪
- clip_horizontal：水平方向裁剪
三、常用布局

线性布局LinearLayout

基本结构（布局是可以嵌套的）：
```
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">
 
    
 
LinearLayout>
```
orientation属性：水平排列、垂直排列

线性布局内部的各视图有两种排列方式:
- orientation属性值为horizontal时，内部视图在水平方向从左往右排列
- orientation属性值为vertical时，内部视图在垂直方向从上往下排列。
- 如果不指定orientation属性，则LinearLayout默认水平方向排列。
例如实现效果：

可以外部LinearLayout 垂直，里面嵌套两个子LinearLayout ，子1水平（按钮1、2），子2垂直（按钮3、4）
```
 
"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"
    tools:context=".activity_text_view"
    android:orientation="vertical">
 
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮1" />
 
        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮2" />
    LinearLayout>
 
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">>
        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮3" />
        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按钮4" />
    LinearLayout>
 
LinearLayout>
```
layout_weight属性：权重占比

android:layout_weight="1"
```
 
<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
 
    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="Button 1" />
 
    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:text="Button 2" />
 
LinearLayout>
 
```
layout_weight通常需要配合0dp（或者0dip，0sp等）的设置来实现权重的分配。这是因为在LinearLayout中，layout_weight属性通常用于控制视图在布局中相对于其他视图的权重，而实际的尺寸则由layout_width或layout_height来控制。

使用0dp的目的是告诉LinearLayout在相应的方向上要根据权重进行分配，而不是根据实际的固定尺寸。

如果宽度为0dp，weight权重指的就是水平方向上的占比

如果高度为0dp，weight权重指的就是竖直方向上的占比

相对布局RelativeLayout

参考文章：11_Android的相对布局(RelativeLayout)

相对布局的下级视图位置由其他视图决定。用于确定下级视图位置的参照物分两种:
- 与该视图自身平级的视图;
- 该视图的上级视图（也就是它归属的RelativeLayout)
如果不设定下级视图的参照物，那么下级视图默认显示在RelativeLayout内部的左上角。
```
 
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    
 
RelativeLayout>
```
参照物为 平级视图

平级的有两组属性

第一组属性：

android:layout_below：
- 含义：指定该视图应该位于另一个视图的下方。
- 取值：引用其他视图的ID。
android:layout_above：
- 含义：指定该视图应该位于另一个视图的上方。
- 取值：引用其他视图的ID。
android:layout_toLeftOf：
- 含义：指定该视图应该位于另一个视图的左侧。
- 取值：引用其他视图的ID。
android:layout_toRightOf：
- 含义：指定该视图应该位于另一个视图的右侧。
- 取值：引用其他视图的ID。
```
 
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 1" />
 
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/button1"
        android:text="Button 2" />
 
    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@id/button2"
        android:text="Button 3" />
 
RelativeLayout>
 
```
第二组属性：
这组属性用于在相对布局 (RelativeLayout) 中指定视图相对于另一个视图的对齐位置。以下是这些属性的含义：

android:layout_alignLeft：
- 含义：指定该视图的左侧边缘与另一个视图的左侧边缘对齐。
- 取值：引用其他视图的ID。
android:layout_alignRight：
- 含义：指定该视图的右侧边缘与另一个视图的右侧边缘对齐。
- 取值：引用其他视图的ID。
android:layout_alignTop：
- 含义：指定该视图的顶部边缘与另一个视图的顶部边缘对齐。
- 取值：引用其他视图的ID。
android:layout_alignBottom：
- 含义：指定该视图的底部边缘与另一个视图的底部边缘对齐。
- 取值：引用其他视图的ID。
示例
```
 
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button 1" />
 
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/button1"
        android:layout_alignLeft="@id/button1"
        android:text="Button 2" />
 
RelativeLayout>
 
```
在这个例子中，Button 2 被放置在 Button 1 的下方，并且其左侧边缘与 Button 1 的左侧边缘对齐。

参照物为 父级属性

android:layout_alignParentLeft：
- 含义：指定该视图的左侧边缘与其父容器的左侧边缘对齐。
- 取值： true 或 false。
android:layout_alignParentRight：
- 含义：指定该视图的右侧边缘与其父容器的右侧边缘对齐。
- 取值： true 或 false。
android:layout_alignParentTop：
- 含义：指定该视图的顶部边缘与其父容器的顶部边缘对齐。
- 取值： true 或 false。
android:layout_alignParentBottom：
- 含义：指定该视图的底部边缘与其父容器的底部边缘对齐。
- 取值： true 或 false。
android:layout_centerInParent：
- 含义：指定该视图在其父容器中居中显示，无论是水平还是垂直方向。
- 取值： true 或 false。
android:layout_centerHorizontal：
- 含义：指定该视图在其父容器中水平居中显示。
- 取值： true 或 false。
android:layout_centerVertical：
- 含义：指定该视图在其父容器中垂直居中显示。
- 取值： true 或 false。
示例
```
 
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:text="Button 1" />
 
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:text="Button 2" />
 
    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Button 3" />
 
RelativeLayout>
```
在这个例子中，Button 1 被放置在其父容器的左侧边缘， Button 2 则被放置在其父容器的右侧边缘，Button 3 被居中显示在其父容器中。

网格布局GridLayout

详情可以看这篇博客： AndroidStudio网格布局（制作计算机界面）

网格布局支持多行多列的表格排列。

网格布局默认从左往右、从上到下排列，它新增了两个属性:
- columnCount属性，它指定了网格的列数，即每行能放多少个视图;
- rowCount属性，它指定了网格的行数，即每列能放多少个视图;
网格定义： GridLayout将布局划分为行和列，每个单元格称为一个网格。通过android:rowCount和android:columnCount属性，你可以定义行数和列数。
```
 
<GridLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:rowCount="2"
    android:columnCount="3">
 
    
 
GridLayout>
 
```
对齐和间距： GridLayout支持通过layout_gravity属性设置子视图的对齐方式，以及通过layout_margin属性设置视图之间的间距。

权重：类似于LinearLayout，GridLayout也支持layout_rowWeight和layout_columnWeight属性，用于指定行或列的权重，以实现灵活的大小调整。

滚动视图ScrollView

>滚动视图有两种:
- ScrollView，它是垂直方向的滚动视图;垂直方向滚动时，layout_width属性值设置为match_parent，layout_height属性值设置为wrap_content。
- HorizontalScrollView，它是水平方向的滚动视图;水平方向滚动时，layout_width属性值设置为wrap_content，layout_height属性值设置为match_parent。
详情学习这篇博客： 由浅入深细细体会Android的视图滚动

四、按钮触控

按钮控件Button由TextView派生而来,它们之间的区别有:
- Button拥有默认的按钮背景，而TextView默认无背景;
- Button的内部文本默认居中对齐，而TextView的内部文本默认靠左对齐;
- Button会默认将英文字母转为大写，而TextView保持原始的英文大小写;
```
 
<Button
    android:id="@+id/myButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Click me" />
 
```
下面java代码写到onCreate方法里面，用于处理点击事件
```
 
Button myButton = findViewById(R.id.myButton);
myButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 处理按钮点击事件的代码
        Toast.makeText(MainActivity.this, "Button Clicked!", Toast.LENGTH_SHORT).show();
    }
});
 
```
在这个示例中，当按钮被点击时，会显示一个短时期的Toast消息。

不同类型的按钮

Android提供了不同类型的按钮，包括但不限于：
- 普通按钮：使用
- 图像按钮：使用元素定义，可以显示图像而不是文本。
- 切换按钮：使用元素定义，具有两种状态，例如开关。
- 复选框：使用元素定义，表示两种状态之间的选择。
- 单选按钮：使用元素定义，通常用于单选组。
- 浮动操作按钮（FAB）：使用 FloatingActionButton 类定义，通常用于主要操作。
详情：动脑学院视频-p27-p33
相关阅读:
一文理解GIT的代码冲突
 软件测试需求人才越来越多，走上测试道路的人却越来越少？
MySql逗号分割的字段数据分解为多行
 Worthington酒精脱氢酶的特异性和五个应用
 SPA项目之主页面--Mock.js以及组件通信（总线）的运用
 刨根问底 Kafka，面试过程真好使
 C# 入门—实现 Hello, World!
从算力云零开始部署ChatGLM2-6B 教程
 React--组件的生命周期
 2022年中职组网络安全新赛题
原文地址：https://blog.csdn.net/KangYouWei6/article/details/136192827

一、文本显示

设置文本内容

设置文本大小

设置文本颜色

二、视图基础

设置视图的宽高

设置视图间距

三、常用布局

线性布局LinearLayout

orientation属性：水平排列、垂直排列

layout_weight属性：权重占比

相对布局RelativeLayout

参照物为 平级视图

参照物为 父级属性

网格布局GridLayout

滚动视图ScrollView

四、按钮触控

不同类型的按钮

参照物为平级视图

参照物为父级属性