新建一個項目UIWidgetTest，簡單起見，這裏我們允許Android Studio自動創建活動，活動名和佈局都使用默認值
TextView
TextView可以說是最簡單的一種控件了，下面來說TextView的更多用法，修改activity_main.xml中的代碼，代碼如下所示
<?xml version="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=".MainActivity">
<TextView
android:id="@+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="This is TextView!"
android:gravity="center"
android:textSize="24sp"
android:textColor="#00ff00"/>
</LinearLayout>
複製代碼
android:layout_width 和 android:layout_height指定控件的寬度和高度，所有的控件都有這兩個屬性。
match_parent表示控件的大小和父佈局的大小一樣，即控件的大小由父佈局來決定。
wrap_content表示控件的大小剛好能夠包含裏面的內容就可以了，即內容決定控件的大小
android:text 指定TextView顯示的文本內容。
android:gravity 指定文字的對齊方式，可選值爲top,bottom,left,right，center等，可以通過“|”來指定多個值，TextView中的文字默認左上角對齊，我們這裏指定爲center，相當於center_vertical|center_horizontal，即水平和垂直都居中對齊
android:textSize 和 android:textColor分別用來指定文字的大小和顏色，字體大小使用sp作爲單位
運行程序，效果如下所示
當然TextView中還有很多屬性，這裏不一一介紹，用的時候再去查看文檔
Button
Button是程序用於和用戶進行交互的一個重要控件，它可配置的屬性和TextView差不多，我們在activity_main.xml中加入Button
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAllCaps="false"
android:text="Button"
/>
複製代碼
由於系統會對Button中的所有英文字母進行大寫轉換，可以用android:textAllCaps="false"來禁用這一特性。重新運行程序，效果如下所示
接下來我們在MainActivity對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 view) {
//在此添加邏輯
}
});
}
}
複製代碼
如果不喜歡用匿名類的方式註冊監聽器，可以使用實現接口的方式來註冊監聽器，代碼如下所示
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button button = (Button) findViewById(R.id.button);
button.setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
// 業務邏輯
break;
default:
break;
}
}
}
複製代碼
EditText
EditText是程序和用戶交互的另一個控件，它允許用戶在控件裏輸入和編輯，並可以在程序中對這些內容進行處理。
我們在activity_main.xml添加EditText控件，代碼如下所示
<EditText
android:id="@+id/edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:maxLength="2"
android:hint="Type is here!"
/>
複製代碼
android:hint用於在輸入框中顯示一些提示性的文字
android:maxLength指定EditText最大行數，這裏爲兩行，當輸入的內容超過兩行時，文本會繼續向上滾動，而EditText則不會繼續拉伸
我們還可以結合使用EditText和Button來完成一些功能，比如通過點擊來Button來獲取EditText中的輸入的內容，修改MainActivity的代碼如下
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.edit_text);
button.setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
String text = editText.getText().toString();
Toast.makeText(MainActivity.this, text, Toast.LENGTH_SHORT).show();
break;
default:
break;
}
}
}
複製代碼
重新運行程序，效果如下所示
ImageView
ImageView用於在界面上展示圖片的控件
我們在res/drawable目錄下添加兩張圖片
在activity_main.xml添加ImageView控件
<ImageView
android:id="@+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/image_1"
/>
複製代碼
android:src指定一張圖片
我們可以通過程序代碼來動態更新圖片，修改MainActivity中的代碼，如下所示
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.edit_text);
imageView = (ImageView) findViewById(R.id.image_view);
button.setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
imageView.setImageResource(R.drawable.image_2);
break;
default:
break;
}
}
}
複製代碼
通過ImageView的setImageResource()方法將顯示的圖片改成image_2.png,重新運行程序可以看到效果
ProgressBar
ProgressBar用於在程序中顯示一個進度條，表示程序正在加載
在activity_main.xml中添加代碼，如下所示
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
複製代碼
重新運行程序，會看到屏幕中會有一個圓形進度條正在旋轉
android:visibility可用來指定控件的可見屬性，所有的控件都有這個屬性，可選值有3個：invisible、visible 和 gone。
visible 表示控件可見，是默認值。
invisible 表示控件不可見，但是它還佔據着原來的位置和大小。
gone 表示不僅不可見，還不佔用任何屏幕空間
我們還可以通過代碼來設置控件的可見性，使用的是 setVisibility() 方法，可選參數有3個：View.VISIBLE、View.GONE 和 View.INVISIBLE
接下來我們來實現點擊一下按鈕讓進度條消失，再點擊一下讓按鈕出現這種效果，修改MainActivity中的代碼，如下所示
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.edit_text);
imageView = (ImageView) findViewById(R.id.image_view);
progressBar = (ProgressBar) findViewById(R.id.progress_bar);
button.setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
imageView.setImageResource(R.drawable.image_2);
if (progressBar.getVisibility() == View.GONE) {
progressBar.setVisibility(View.VISIBLE);
} else {
progressBar.setVisibility(View.GONE);
}
break;
default:
break;
}
}
}
複製代碼
通過getVisibility() 方法來判斷ProgressBar是否可見，若可見則隱藏，若不可見則顯示出來，重新運行程序，不斷點擊按鈕，你會看到進度條會在顯示和隱藏間來回切換
我們還可以通過style屬性來設置ProgressBar不同的樣式，下面我們來設置成水平進度條，修改activity_main.xml中的代碼，如下所示
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="?android:attr/progressBarStyleHorizontal"
android:max="100"
/>
複製代碼
android:max給進度條設置一個最大值，然後代碼中動態更改進度條的進度，修改MainActivity的代碼，如下所示
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
// 動態更新進度條進度
int progress = progressBar.getProgress();
progress=progress+10;
progressBar.setProgress(progress);
break;
default:
break;
}
}
複製代碼
每點擊一次按鈕，就會先獲取當前進度條的進度，然後在現有進度和基礎上加10作爲更新後的進度。重新運行程序，效果如下所示
AlertDialog
AlertDialog可以在當前頁面彈出一個對話框，在所有界面元素之上，可以屏蔽掉界面其他控件的交互能力，因此AlertDialog一般用於提示一些非常重要的內容或者警告信息。
下面我們來學習一下它的用法，修改MainActivity中的代碼，如下所示
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
// AlertDialog的學習
AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
dialog.setTitle("This is Title");
dialog.setMessage("This is Message");
// 可否用Back鍵關閉對話框
dialog.setCancelable(false);
// 設置確定按鈕的點擊事件
dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
}
});
// 設置取消按鈕的點擊事件
dialog.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
}
});
// 將對話框顯示出來
dialog.show();
break;
default:
break;
}
}
複製代碼
首先通過AlertDialog.Builder 創建一個 AlertDialog 實例，然後爲這個對話框設置標題、內容、可否用Back鍵關閉對話框等屬性，再調用setPositiveButton() 方法設置對話框確認按鈕的點擊事件，調用setNegativeButton() 方法設置對話框取消按按鈕的點擊事件，最後調用show() 方法將對話框顯示出來
ProgressDialog
ProgressDialog 跟AlertDialog很類似，不同的是ProgressDialog對話框中會有一個進度條，表示當前操作比較耗時，讓用戶耐心等待
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.button:
// ProgressDialog的學習
ProgressDialog progressDialog = new ProgressDialog(MainActivity.this);
progressDialog.setTitle("This is ProgressDialog");
progressDialog.setMessage("This is Message");
progressDialog.setCancelable(true);
progressDialog.show();
break;
default:
break;
}
}
複製代碼
內容參考自《第一行代碼》