Android Studio提供了可視化的編輯器，實際開發中應該是直接運用更加直觀，但本文博先對xml代碼進行學習Android所自帶的UI開發工具。

Android常用的UI控件

TextView

TextView可以說是Android中最簡單的一個控件了。它主要用於在界面上顯示一段文本信息。修改博文《Android學習筆記之——Android Studio的安裝（3.6版本）、Java的基本語法及Android的概述》中的hello world工程中的activity_main.xml代碼：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"   //當前控件定義了一個唯一標識符
        //然後指定了控件的寬度和高度
        //可選值有3種：match_parent 、fill_parent 和wrap_content
        android:layout_width="match_parent"  //也就是手機屏幕的寬度了
        android:layout_height="wrap_content"

        android:text="This is TextView" />   //指定TextView中顯示的文本內容
</LinearLayout>

運行結果如下圖所示

雖然指定的文本內容正常顯示了，不過我們好像沒看出來TextView的寬度是和屏幕一樣寬的。其實這是由於TextView中的文字默認是居左上角對齊的，雖然TextView的寬度充滿了整個屏幕，可是由於文字內容不夠長，所以從效果上完全看不出來。接下來修改文字的對齊方式

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="This is TextView" />
</LinearLayout>

使用android:gravity 來指定文字的對齊方式，可選值有top 、bottom 、left、right 、center。可以用“|”來同時指定多個值

除此之外，還可以對其字體的大小和顏色進行修改。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />
</LinearLayout>

通過android:textSize 屬性可以指定文字的大小，通過android:textColor 屬性可以指定文字的顏色，在Android中字體大小使用sp作爲單位

Button

Button是程序用於和用戶進行交互的一個重要控件，它可配置的屬性和TextView是差不多的。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button" />

</LinearLayout>

在佈局文件裏面設置的文字是“Button”，但最終的顯示結果卻是“BUTTON”。這是由於系統會對Button中的所有英文字母自動進行大寫轉換。可以使用如下配置來禁用這一默認特性

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textAllCaps="false"
        />

</LinearLayout>

接下來我們可以在MainActivity中爲Button的點擊事件註冊一個監聽器，如下所示：

package com.example.demo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button= (Button) findViewById(R.id.button);
        
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //在此處添加邏輯，這樣按了按鈕後，就會執行這個邏輯下的方法
            }
        });
        
        
    }
}

EditText

EditText是程序用於和用戶進行交互的另一個重要控件，它允許用戶在控件裏輸入和編輯內容，並可以在程序中對這些內容進行處理。EditText的應用場景非常普遍，在進行發短信、發微博、聊QQ等操作時，都是使用EditText，修改activity_main.xml中的代碼，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textAllCaps="false"
        />
    
    《<EditText
        android:id="@+id/editext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
    />

</LinearLayout>

至此，我們也可以總結出Android控件的使用規律了，用法基本上都很相似：給控件定義一個id，再指定控件的寬度和高度，然後再適當加入一些控件特有的屬性就差不多了。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textAllCaps="false"
        />

    《<EditText
        android:id="@+id/editext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Type something here"
    />

</LinearLayout>

這裏使用android:hint 屬性指定了一段提示性的文本，然後重新運行程序

可以通過添加android:maxLines="2"。指定了EditText的最大行數爲兩行，這樣當輸入的內容超過兩行時，文本就會向上滾動，而EditText則不會再繼續拉伸。

接下來實現一個小功能爲：通過點擊button按鈕，來獲得輸入的內容。修改MainActivity代碼：

package com.example.demo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private EditText editText;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button= (Button) findViewById(R.id.button);
        editText=(EditText) findViewById(R.id.editext); //得到EditText的實例

        button.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {  //在按鈕點擊事件中調用getText() 方法
        switch (v.getId()) {
            case R.id.button:
                String inputText = editText.getText().toString();//getText() 方法獲取到輸入的內容，再調用toString() 方法轉換成字符串，
                Toast.makeText(MainActivity.this, inputText,Toast.LENGTH_SHORT).show(); //Toast將輸入的內容顯示出來
                break;
            default:
                break;
        }
    }
}

結果如下

ImageView

ImageView是用於在界面上展示圖片的一個控件，它可以讓我們的程序界面變得更加豐富多彩。學習這個控件需要提前準備好一些圖片，圖片通常都是放在以“drawable”開頭的目錄下的。目前我們的項目中有一個空的drawable目錄，不過由於這個目錄沒有指定具體的分辨率，所以一般不使用它來放置圖片。這裏我們在res目錄下新建一個drawable-xhdpi目錄，然後將事先準備好的兩張圖片img_1.png和img_2.png複製到該目錄當中。接下來修改activity_main.xml，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textAllCaps="false"
        />

    《<EditText
        android:id="@+id/editext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Type something here"
    />

    <ImageView
        android:id="@+id/image_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:src="@drawable/img_1"
     />

</LinearLayout>

使用android:src 屬性給ImageView指定了一張圖片

還可以在程序中通過代碼動態地更改ImageView中的圖片，然後修改MainActivity的代碼

package com.example.demo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private EditText editText;

    private ImageView imageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button= (Button) findViewById(R.id.button);
        editText=(EditText) findViewById(R.id.editext); //得到EditText的實例
        imageView=(ImageView) findViewById(R.id.image_view);

        button.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {  //在按鈕點擊事件中調用getText() 方法
        switch (v.getId()) {
            case R.id.button:
//                String inputText = editText.getText().toString();//getText() 方法獲取到輸入的內容，再調用toString() 方法轉換成字符串，
//                Toast.makeText(MainActivity.this, inputText,Toast.LENGTH_SHORT).show(); //Toast將輸入的內容顯示出來
               imageView.setImageResource(R.drawable.img_2);
                break;
            default:
                break;
        }
    }
}

點擊一下按鈕就會變爲其他照片了

ProgressBar

ProgressBar用於在界面上顯示一個進度條，表示我們的程序正在加載一些數據。它的用法也非常簡單，修改activity_main.xml中的代碼，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="66sp"
        android:textColor="#00ff00"
        android:text="This is TextView" />

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textAllCaps="false"
        />

    《<EditText
        android:id="@+id/editext"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Type something here"
    />

<!--    <ImageView-->
<!--        android:id="@+id/image_view"-->
<!--        android:layout_width="wrap_content"-->
<!--        android:layout_height="match_parent"-->
<!--        android:src="@drawable/img_1"-->
<!--        />-->

    <ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        style="?android:attr/progressBarStyleHorizontal"
        android:max="100"
        />

</LinearLayout>

mainactivity修改爲：

package com.example.demo;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private EditText editText;

    private ImageView imageView;

    private ProgressBar progressBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button= (Button) findViewById(R.id.button);
        editText=(EditText) findViewById(R.id.editext); //得到EditText的實例
//        imageView=(ImageView) findViewById(R.id.image_view);
        progressBar = (ProgressBar) findViewById(R.id.progress_bar);

        button.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {  //在按鈕點擊事件中調用getText() 方法
        switch (v.getId()) {
            case R.id.button:
//                String inputText = editText.getText().toString();//getText() 方法獲取到輸入的內容，再調用toString() 方法轉換成字符串，
//                Toast.makeText(MainActivity.this, inputText,Toast.LENGTH_SHORT).show(); //Toast將輸入的內容顯示出來
//               imageView.setImageResource(R.drawable.img_2);
//                if (progressBar.getVisibility() == View.GONE) {
//                    progressBar.setVisibility(View.VISIBLE);
//                } else {
//                    progressBar.setVisibility(View.GONE);
//                }
                int progress = progressBar.getProgress();
                progress = progress + 10;
                progressBar.setProgress(progress);

                break;
            default:
                break;
        }
    }
}

AlertDialog

AlertDialog可以在當前的界面彈出一個對話框，這個對話框是置頂於所有界面元素之上的，能夠屏蔽掉其他控件的交互能力，因此AlertDialog一般都是用於提示一些非常重要的內容或者警告信息。比如爲了防止用戶誤刪重要內容，在刪除前彈出一個確認對話框。修改MainActivity中的代碼，如下所示：

package com.example.demo;

import androidx.appcompat.app.AppCompatActivity;

import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.ProgressBar;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    private EditText editText;

    private ImageView imageView;

    private ProgressBar progressBar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button button= (Button) findViewById(R.id.button);
        editText=(EditText) findViewById(R.id.editext); //得到EditText的實例
//        imageView=(ImageView) findViewById(R.id.image_view);
        progressBar = (ProgressBar) findViewById(R.id.progress_bar);

        button.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {  //在按鈕點擊事件中調用getText() 方法
        switch (v.getId()) {
            case R.id.button:

                //捕獲文字
//                String inputText = editText.getText().toString();//getText() 方法獲取到輸入的內容，再調用toString() 方法轉換成字符串，
//                Toast.makeText(MainActivity.this, inputText,Toast.LENGTH_SHORT).show(); //Toast將輸入的內容顯示出來

                //改變顯示的圖片
//               imageView.setImageResource(R.drawable.img_2);

                ////進度調
//                if (progressBar.getVisibility() == View.GONE) {
//                    progressBar.setVisibility(View.VISIBLE);
//                } else {
//                    progressBar.setVisibility(View.GONE);
//                }
//                int progress = progressBar.getProgress();
//                progress = progress + 10;
//                progressBar.setProgress(progress);

                //警告框
                //首先通過AlertDialog.Builder創建一個AlertDialog的實例
                AlertDialog.Builder dialog = new AlertDialog.Builder (MainActivity.this);
                dialog.setTitle("This is Dialog");//爲這個對話框設置標題
                dialog.setMessage("Something important.");//內容
                dialog.setCancelable(false);//可否用Back鍵關閉對話框等屬性
                dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
                    //調用setPositiveButton() 方法爲對話框設置確定按鈕的點擊事件
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                    }
                });
                dialog.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
                    //調用setNegativeButton() 方法設置取消按鈕的點擊事件
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                    }
                });
                dialog.show();    //將對話框顯示出來

                break;
            default:
                break;
        }
    }
}

ProgressDialog

ProgressDialog和AlertDialog有點類似，都可以在界面上彈出一個對話框，都能夠屏蔽掉其他控件的交互能力。不同的是，ProgressDialog會在對話框中顯示一個進度條，一般用於表示當前操作比較耗時，讓用戶耐心地等待。（這裏就不作介紹了）

Android學習筆記之——UI設計

Android常用的UI控件

TextView

Button

EditText

ImageView

ProgressBar

AlertDialog

ProgressDialog

控件的基本佈局

【筆記】動手學深度學習-前言

公司新來一個幹練小夥，把 MyBatis 替換成 MyBatis-Plus，上線後哭暈在廁所。。。

支持非IE瀏覽器真的那麼難嗎？

爲啥就那麼痛恨IE？

Brian Sun：回覆“爲啥就那麼痛恨IE？”

體驗下，大廠在使用功能的API網關！

見鬼了！我家的 WiFi 只有下雨天才能正常使用...

短視頻文案提取原來如此簡單

oa系統集成及案例樣式

開發人員爲什麼要支持非IE瀏覽器的四個故事

可見光通信及定位技術調研報告

學習筆記之——基於ArcGIS的Android地圖構建

Android學習筆記之——通過Intent來啓動不同的Activity

可見光成像通信（Optical Camera Communication,OCC）——基於IEEE 802.15.7-2018標準的解讀

Android學習筆記之——手機中幾種自帶傳感器的應用

https://yachay.unat.edu.pe/blog/index.php?comment_area=format_blog&comment_component=blog&comment_co

linux以太網驅動總結