常规UI编程 | 青训营笔记

这是我参与「第四届青训营 」笔记创作活动的第2天

1.UI组件

UI:User Interface

常规UI组件

组件	Java Class	Package
文本组件	TextView	android.widget.TextView
图片组件	ImageView	android.widget.ImageView
按钮组件	Button	android.widget.Button
输入框组件	EditText	android.widget.EditText
复选框组件	CheckBox	android.widget.CheckBox
单选按钮	RadioButton	android.widget.RadioButton
...	...	...

常规UI组件大多由Android Framework中的android.widget这个package提供

高级UI组件

组件	Java Class
滑动组件	ScrollView
列表组件	ListView/RecyclerView
下拉刷新组件	PullToRefresh
分页组件	ViewPager
布局组件	LinearLayout/RealtiveLayout/...
...	...

常规UI组件大多数View，高级UI组件大多是ViewGroup，比常规UI组件有多的功能

2.常用布局

LinearLayout

线性布局LinearLayout主要以水平或垂直方式来排列界面中的控件。并将控件排列到一条直线上。

线性布局是一种简单基础的布局。线性布局的基础格式如下

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:paddingLeft="16dp"
     android:paddingRight="16dp"
     android:orientation="vertical" > 
 ​
     <EditText        
         android:layout_width="match_parent"        
         android:layout_height="wrap_content" />   
 ​
     <EditText        
         android:layout_width="match_parent"      
         android:layout_height="wrap_content" />   
 ​
     <EditText       
         android:layout_width="match_parent"     
         android:layout_height="0dp"     
         android:layout_weight="1"      
         android:gravity="top" />   
 ​
     <Button      
         android:layout_width="100dp"       
         android:layout_height="wrap_content"     
         android:layout_gravity="right" />
 </LinearLayout>

RelativeLayout

相对布局RelativeLayout可以通过相对定位的方式让控件出现在布局中，可以相对于父布局定位，也可以相对于其他控件定位

相对于控件进行定位的方式

 上：android:layout_above="@id/控件id"
 下：android:layout_below="@id/控件id"
 左：android:layout_toLeftOf="@id/控件id"
 右：android:layout_toRightOf="@id/控件id"

FrameLayout

FrameLayout又称作帧布局，这种布局方式默认放置在布局左上角，无序考虑其他的控件。

 <FrameLayout
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:background="@android:color/white">
 ​
     <TextView
         android:layout_width="300dp"
         android:layout_height="300dp"
         android:gravity="center"
         android:background="@android:color/holo_blue_bright"
         android:text="我是第一层"/>
 ​
     <TextView
         android:layout_width="150dp"
         android:layout_height="140dp"
         android:gravity="center"
         android:background="@android:color/holo_green_light"
         android:text="我是第二层"/>
 ​
 </FrameLayout>

ConstraintLayout

ConstraintLayout约束布局是目前Android Studio创建一个Activity的默认根布局，使用前需要添加依赖才能使用，因为是后来出现的布局方式，要兼容之前的版本，所以以引入的方式使用。

每个控件至少要两个约束条件，一个水平约束，一个垂直约束。