线性布局、文本、输入框、按钮组件

Android的页面布局

一：线性布局（LinearLayout）

原理/实例解释

基本概念：

线性布局是我们在安卓页面中常用的一种布局方法，它分为“水平线性horizontal”和“垂直线性vertical”，我们在选择线性布局时必须要在水平和垂直中选择一项，并且只能写在“.xml”中

概念视图：

基本代码：

1.在xml代码文件中选中“android.support.constraint.ConstraintLayout”，将它修改成“LinearLayout”

2.在内容中写入“android:orientation="”代码，并选择你需要的排版方式，是水平还是垂直”

3.此时，页面的排版方式就确定下来了。我们把所需要写的组件和内容代码，就写在</LinearLayout>的前面

二：组件

原理/实例解释

基本概念：

组件是我们写在安卓页面中的功能，他可以是输入框、文本、提交按钮……，页面中所看到的几乎都是组件构成的

概念视图：

*我们的软件页面几乎都是不同组件搭配不同布局方式来制作的，相当于一个精细的表格，在这个表格中插入不同的内容，最后让这个表格的边框消失，以达到页面布局和功能布局完整的效果

*组件可以理解为表面和内在，表面通常是一个图标或者能看到的内容，但内在则是当用户点击时需要实现的过程，这一过程我们通常在Android文件中的java文件中编写

▎1.文本组件（TextView）

基本概念：

文本组件是指在页面中显示文本信息的一个区域。我们可以简单理解成Word中的（文本框），只是文本内容以及提前设置好了，不能更改。一个页面可以设置多个文本组件

概念视图：

基本代码：

<TextView

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="显示的文本内容"

/>

▎2.输入框组件（EditText）

基本概念：

输入框组件是指在页面中设置一个可以供用户输入内容的输入框，用户可以输入一定的内容在内，内容将会配合“提交按钮”组件提交至指定位置储存或验证

概念视图：

*输入框组件一般配合“按钮”组件和“文本”组件一同使用，已达到想要效果

*“按钮”组件与“文本”组件一样，依然能使用代码对其位置进行调整，具体方法和“文本组件”相同

基本代码：

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:hint="请输入您的密码"

/>

▎3.按钮组件（Button）

在安卓开发中，我们的手机中有很多按钮，我们通过点击他们来实现一些跳转之类的功能，我们学习的Button就是教我们如何创建这些按钮（仅仅是按钮的创建，至于点击之后会发生什么叫做“事件”）

概念视图：

基本代码（xml）：

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="登录"

android:id="@+id/btn1"

android:onClick="denglu"

/>

▎任务：创建一个按钮组件，模拟登陆按钮，任意设置一个背景色，组件大小以自身大小为准，组件内文字为“登陆”

基本代码：

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="登录"

android:background="@color/colorPrimary"

android:id="@+id/btn1"

android:onClick="denglu"

/>

编译效果：

▎内容扩展：对组件进行其他位置调整修改

分析：在我们创建组件后，组件默认位置可能不到位，我们就需要对组件在页面中的位置进行调整，这里将用到几种方法，对大部分组件都有效果

1.调整文字的大小

android:textSize="数字sp"

2.文字颜色调整

android:textColor="颜色参数"

3.文字在组件中的位置调整

android:gravity="具体位置"

4.组件与页面布局之间的四边距离调整

android:layout_margin="具体数字px"

5.组件与页面布局之间的上、下、左、右距离调整

android:layout_marginLeft="具体数字px" <!—调整该组件与当面布局页面左边的距离-->

android:layout_marginTop="具体数字px" <!—调整该组件与当面布局页面顶部的距离-->

android:layout_marginRight="具体数字px" <!—调整该组件与当面布局页面右边的距离-->

android:layout_marginBottom="具体数字px" <!—调整该组件与当面布局页面底部的距离-->

*还有很多调整方法，这里不再做阐述，可以尝试代码提醒的方式一个个尝试具体效果

本文来源：https://www.2haoxitong.net/k/doc/ee2b45b886c24028915f804d2b160b4e777f8160.html