文章目錄
- UI開發的點點滴滴
- 一、常用控制元件的使用方法
- 1、TextView
- Button
- EditText
- 使用點擊按鈕獲取EditText中輸入的內容
- ImageView(在頁面上展示圖片的控制元件,圖片防止在res下的以drawable開頭的目錄中)
- ProgressBar(進度條,表示程式正在加載一些資料)
- 常用屬性
- 如何讓進度條加載完消失?(Android控制元件的可見屬性,所有的Android控制元件都具有這個屬性,android:visibility)
- AlertDialog(==不需在主活動中添加標簽==,可以在當前頁面彈出一個對話框,這個對話框置頂于所有頁面元素之上,能夠屏蔽掉其他控制元件的互動能力)
- ProgressDialog
- 注意點(setCancelable()如果傳入false,不能通過back取消,必須呼叫dissmiss方法關閉對話框)
- 四種基本布局(布局是可用于放置很多控制元件的容器,布局可嵌套)
- 線性布局(將所包含的控制元件在線性方向上依次排列)
- 一些常用屬性
- 相對布局(通過相對定位的方式可以讓控制元件出現在布局的任何位置)
- 相對父布局進行定位
- 相對于控制元件進行定位
- 幀布局(FrameLayout)
- 百分百布局(PercentFrameLayout和PercentRelativeLayout)
- 例子
- 自定義控制元件
- xml檔案的引入(可以使用include標簽引入)
- 創建自定義控制元件
- 最常用和最難用的控制元件---ListView
- ListView的簡單用法
- 定制ListView的界面
UI開發的點點滴滴
一、常用控制元件的使用方法
1、TextView
如:
<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:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/text_view"
android:text="This is TextView"></TextView>
</LinearLayout>
TextView的部分屬性:
- 1、android:id:給當前控制元件定義一個唯一識別符號
- 2、android:layout_width:指定控制元件寬度
- 3、android:layout_height:指定控制元件高度
- 4、android:text:指定TextView中顯示的文本內容
- 5、android:textSize:指定文字的大小,在android中字體大小使用sp作為單位,
- 6、android:textColor:指定文字的顏色
- 7、android:gravity:[?ɡr?v?ti] 引力,重力,指定文字的對齊方式
TextView中的文本內容雖然顯示,但是在左上角,因為TextView中的文字默認是左上角對齊的,
使用android:gravity指定文字的對齊方式,可選值有top、bottom、left、right、center,可以用"|"來同時指定多個值,
<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:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/text_view"
android:gravity="center"
android:text="This is TextView"></TextView>
</LinearLayout>
Button
Button是程式用于和用戶進行互動的一個重要控制元件,屬性和TextView差不多,可以在activity_main.xml中這樣加入Button:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"></TextView>
</LinearLayout>
雖然在布局檔案中設定的文字為Button,但是最終顯示卻是”BUTTOM“,這是由于系統會對Button中的所有英文字母自動進行大寫轉換,但是可以配置禁用這個默認屬性,在Button中修改android:textAllCaps=“false”
android:textAllCaps="false"
可以為Button的點擊事件注冊一個監聽器,
public class MainActivity extends AppCompatActivity{
@Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(saveInstanceState);
setContentView(R.layout.activity_main);
Button button = (Button)findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View v){
//在此添加邏輯
}
});
}
}
點擊按鈕時,就會執行監聽器中的onClick()方法,
也可以通過下面實作介面的方式進行注冊,
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
@Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(saveInstanceState);
setContentView(R.layout.activity_main);
Button button = (Button)findViewById(R.id.button);
button.setOnClickListener(this);
}
@Override
public void onClick(View v){
switch(v.getId()){
case R.id.button:
//再此添加邏輯
break;
default:
break;
}
}
}
EditText
一些屬性:
- android:hit:輸入框提示內容,一旦輸入,提示內容消失
- andorid:maxLines:指定EditText的最大行數,
程式和用戶進行互動的另外一個重要控制元件,
修改activity_main.xml中的代碼:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="@+id/edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
一般在輸入框顯示一些提示性的文字,一旦用戶輸入了任何內容,這些文字提示就會消失,可以通過android:hint屬性進行設定,
使用點擊按鈕獲取EditText中輸入的內容
package com.example.uiwidgettest;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
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.edit_text);
button.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.button:
//getText方法獲取輸入的內容
String inputText = editText.getText().toString();
Toast.makeText(MainActivity.this, inputText, Toast.LENGTH_SHORT).show();
break;
default:
break;
}
}
}
ImageView(在頁面上展示圖片的控制元件,圖片防止在res下的以drawable開頭的目錄中)
圖片通常放在以drawable開頭的目錄下,目前專案中有一個空的drawable目錄,但沒有指定具體解析度,所以一般不使用它來放置圖片,在res目錄下新建一個drawable-xhdpi目錄,
在activity_main.xml中添加標簽:
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/image_view"
android:src="@drawable/img_1" />
package com.example.uiwidgettest;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
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.edit_text);
imageView = (ImageView)findViewById(R.id.image_view);
button.setOnClickListener(this);
}
//通過按鈕點擊事件將將顯示的img_1圖片修改為img_2圖片
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.button:
imageView.setImageResource(R.drawable.img_2);
break;
default:
break;
}
}
}
ProgressBar(進度條,表示程式正在加載一些資料)
用于在頁面上顯示一個進度條,表示我們的程式正在加載一些資料,
常用屬性
android:visibility屬性的值:
- 1、visible:控制元件可見的
- 2、invisible:控制元件不可見,但是仍然占據著原來的位置和大小,可以理解成控制元件編程透明狀態
- 3、gone:控制元件不可見,而且不占用任何螢屏空間,
通過style屬性可以將它指定成水平進度條(如果不設定是箭頭旋轉的樣式)
android:max屬性用于給進度條設定一個最大值,
如何讓進度條加載完消失?(Android控制元件的可見屬性,所有的Android控制元件都具有這個屬性,android:visibility)
在activity_main.xml中添加標簽,
<!--進度條樣式為水平進度條,最大值為100-->
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="?android:attr/progressBarStyleHorizontal"
android:max="100"
/>
我們可以通過代碼設定控制元件的可見性,使用的是setVisibility()方法,可以傳入View.VISIBLE、View.INVISIBLE和View.gone
package com.example.uiwidgettest;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
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);
progressBar = (ProgressBar)findViewById(R.id.progress_bar);
button.setOnClickListener(this);
}
//通過按鈕點擊事件設定進度條,如果進度條可見就將其隱藏,否則將其顯示出來,
//通過xml可以看出將進度條修改成了水平進度條樣式,每次點擊會將進度條的值加10.
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.button:
int progress = progressBar.getProgress();
progress = progress+10;
progreeBar.setProgress(progress);
if(progressBar.getVisibility() == View.GONE) {
progressBar.setVisibility(View.VISIBLE);
}else {
progressBar.setVisibility(View.GONE);
}
break;
default:
break;
}
}
}
AlertDialog(不需在主活動中添加標簽,可以在當前頁面彈出一個對話框,這個對話框置頂于所有頁面元素之上,能夠屏蔽掉其他控制元件的互動能力)
package com.example.uiwidgettest;
import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import android.content.DialogInterface;
import android.os.Bundle;
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);
progressBar = (ProgressBar)findViewById(R.id.progress_bar);
button.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.button:
AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
//設定對話框標題
dialog.setTitle("This is Dialog");
dialog.setMessage("Something important.");
dialog.setCancelable(false);
//設定確定按鈕的點擊事件
dialog.setPositiveButton("ok", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
});
//設定取消按鈕的點擊事件
dialog.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
}
});
//將對話框顯示出來,
dialog.show();
default:
break;
}
}
}
ProgressDialog
ProgressDialog和AlertDialog有點類似,都會在界面上彈出一個對話框,都能夠屏蔽掉其它控制元件的互動能力,不同的是,ProgressDialog會在會話框中顯示一個進度條,
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 v) {
switch (v.getId()){
case R.id.button:
ProgressDialog progressDialog = new ProgressDialog(MainActivity.this);
//設定標題
progressDialog.setTitle("This is ProgressDialog");
//設定內容
progressDialog.setMessage("Loading");
progressDialog.setCancelable(true);
//將ProgressDialog顯示出來
progressDialog.show();
break;
default:
break;
}
}
}
注意點(setCancelable()如果傳入false,不能通過back取消,必須呼叫dissmiss方法關閉對話框)
如果在setCancelable()中傳入了false,表示ProgressDialog是不能通過Back鍵取消掉的,這時你就可以在代碼中做好控制,當資料加載完成后必須呼叫ProgressDialog的dismiss()方法來關閉對話框,否則ProgressDialog將會一直存在,
四種基本布局(布局是可用于放置很多控制元件的容器,布局可嵌套)

線性布局(將所包含的控制元件在線性方向上依次排列)
一些常用屬性
- android:orientation:控制元件的排列方向
- android:layout_weight:系統會將LinerLayout下所有控制元件指定的layout_weight值相加,得到一個總值,然后每個控制元件所占比例就是其layout_weight的值除剛才算出來的總值,
- android:layout_gravity:用于指定控制元件在布局中的對齊方式
android:layout_gravity:當LinearLayout的排列方向是horizontal時,只有垂直方向上的對齊方式才會生效,因為此時水平方向上的長度是不固定的,每添加一個控制元件,水平方向上的長度都會改變,因而無法指定該方向上的對齊方式,同樣的道理,當LinearLayout的排列方向是vertical時,只有水平方向上的對齊方式才會生效,
前面學習了TextView控制元件的android:gravity屬性,表示文字在控制元件中的對齊方式,android:layout_gravity用于指定控制元件在布局中的對齊方式,
相對布局(通過相對定位的方式可以讓控制元件出現在布局的任何位置)
align:[??la?n]對齊
相對父布局進行定位
- android:layout_alignParentLeft:與父布局的左邊對齊
- android:layout_alignParentTop:與父布局的上邊對齊
- android:layout_alignParentRight:與父布局的右邊對齊
- android:layout_alignParentBottom:與父布局的下面對齊
- android:layout_centerInParent:在父布局的中間
相對于控制元件進行定位
- android:layout_above:讓一個控制元件位于另一個控制元件的上方,需要為這個屬性指定相當于控制元件id的參考,比如android:layout_above="@id/button3"表示讓該控制元件位于Button3的上方,
- android:layout_below:讓一個控制元件位于另一個控制元件的下方
- android:layout_toLeftOf:讓一個控制元件位于另一個控制元件的左側
- android:layout_toRightOf:讓一個控制元件位于另一個控制元件的右側
- android:layout_alignLeft:讓一個控制元件和另一個控制元件的左邊緣對齊,
- android:layout_alignRight:讓一個控制元件的右邊緣和另一個控制元件的右邊緣對齊
- android:layout_alignTop
- android:layout_alignBottom
當一個控制元件去參考另一個控制元件的id的時候,該控制元件一定要定義在參考控制元件的后面,不然會出現找不到id的情況,
幀布局(FrameLayout)
所有控制元件默認擺放在布局的左上角,標簽在后面的會顯示在前面標簽的上面,但是在幀布局中的標簽也可以使用layout_gravity屬性指定控制元件在布局中的對齊方式,
百分百布局(PercentFrameLayout和PercentRelativeLayout)
在上面介紹的布局中,只有LinearLayout支持使用layout_weight屬性來實作按比例指定控制元件大小的功能,而幀布局和相當布局不支持,
百分比布局只為FrameLayout和RelativeLayout進行了功能擴展,提供了PercentFrameLayout和PercentRelativeLayout,
由于百分比布局是新增布局,所以要引入庫,打開app/build.gradle檔案,在dependicies中添加如下內容:
denpendicies{
compile fileTree(dir,'libs',include:['*.jar'])
compile 'com.android.support:appcompat-v7:24.2.1'
compile 'com.android.support:percent:24.2.1'
testCompile 'junit:junit:4.12'
}
百分百布局中的控制元件可以使用app:layout_widthPercent、app:layout_heightPercent設定控制元件的寬度和高度的占比,
例子
<android:support.percent.PercentFrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"">
<Button
android:id="@+id/button1"
android:text="Button 1"
android:layout_gravity="left|top"
app:layout_widthPercent="50%"
app:layout_heightPercent="50%"
/>
<Button
android:id="@+id/button2"
android:text="Button 2"
android:layout_gravity="right|top"
app:layout_widthPercent="50%"
app:layout_heightPercent="50%"
/>
<Button
android:id="@+id/button3"
android:text="Button 3"
android:layout_gravity="left|bottom"
app:layout_widthPercent="50%"
app:layout_heightPercent="50%"
/>
<Button
android:id="@+id/button4"
android:text="Button 4"
android:layout_gravity="right|bottom"
app:layout_widthPercent="50%"
app:layout_heightPercent="50%"f
/>
</android.support.percent.PercentFrameLayout>
我們之所以能使用app前綴的屬性就是因為我們定義了app的命名控制元件,我們能使用android前綴的屬性也是同樣的道理,
PercentFrameLayout會繼承FrameLayout的特性,PercentRelativeLayout會繼承RelativeLayout中的所有屬性
自定義控制元件
- 我們使用的所有控制元件都是直接或間接繼承自View的,所有布局都是直接或間接繼承自ViewGroup的,Vew是Android的一個UI組件,它可以在螢屏上繪制出一塊矩形區域,并能回應這塊區域的各種事件,我們使用的各種控制元件其實就是在View的基礎上添加了各自特有的功能,
- ViewGroup是一種特殊的View,可以包含很多子View和子ViewGroup,是一種可用于放置控制元件和布局的容器,

Layout下創建title.xml檔案
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="@+id/title_back"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:textColor="#fff"
android:text="Back">
</Button>
<TextView
android:id="@+id/title_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:layout_weight="1"
android:layout_margin="5dp"
android:text="Title text"
android:textColor="#fff"
android:textSize="24sp"></TextView>
<Button
android:id="@+id/title_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:text="Edit"
android:textColor="#fff"></Button>
</LinearLayout>
android:layout_margin屬性可以指定控制元件在上下左右方向上偏移的距離,也可以使用anfroid:layout_marginLeft或android:layout_marginTop等屬性來單獨指定控制元件在某個方向上偏移的距離,
xml檔案的引入(可以使用include標簽引入)
如果在layout目錄下創建一個title.xml,可以通過include陳述句引入,比如在activity_main.xml中就可以使用include標簽引入,但是這樣如果每次需要呼叫點擊事件就比較麻煩,要去一個一個實作,
<include layout="@layout/title" />
創建自定義控制元件
引入布局的技巧確實解決了重復撰寫布局代碼的問題,但是如果布局中有一些控制元件要求能夠回應事件,我們還是需要在每個活動中為這些控制元件單獨撰寫一次事件注冊的代碼,
新建TitleLayout繼承自LinerLayout,讓它成為我們自定義的標題欄控制元件,代碼如下所示:
public class TitleLayout extends LinearLayout {
public TitleLayout(Context context, AttributeSet attrs){
super(context,attrs);
//from()方法可以構建一個LayoutInflater物件
// 呼叫inflate方法就可以動態加載一個布局檔案
// 第一個引數是要加載的布局檔案的id,第二個引數是給加載好的布局再添加一個父布局,這里我們想要指定為TitleLayout,于是傳入this
//
LayoutInflater.from(context).inflate(R.layout.title,this);
Button titleBack = (Button)findViewById(R.id.title_back);
Button titleEdit = (Button)findViewById(R.id.title_edit);
titleBack.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
((Activity)getContext()).finish();
}
});
titleEdit.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getContext(),"You clicked Edit button",Toast.LENGTH_SHORT).show();
}
});
}
}
修改activity_main.xml檔案:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.example.uicustomviews.TitleLayout
android:layout_height="match_parent"
android:layout_width="wrap_content"
/>
</LinearLayout>
通過以上實作,每當我們在一個新的布局中引入TitleLayout時,回傳按鈕和編輯按鈕的點擊事件就已經自動實作好了,這就省去了很多撰寫重復代碼的作業,
需要主義的是,添加自定義控制元件和普通控制元件的方式是一樣的,只不過在添加自定義控制元件的時候,我們需要指明控制元件的完整類名,包名在這里是不可以省略的,
最常用和最難用的控制元件—ListView
ListView允許用戶通過手指上下滑動的方式將螢屏外的資料滾到螢屏內,同事螢屏上原有的資料則會滾動出螢屏,
ListView的簡單用法
在activity_main.xml中添加ListView標簽
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/list_view"></ListView>
</LinearLayout>
修改MainActivity.java
package com.example.listviewtest;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
public class MainActivity extends AppCompatActivity {
private String[] data = {"Apple","Banana","Orange","Watermelon","Pear","Grape","Pineapple","Strawberry","Cherry","Mango","Apple","Banana","Orange","Watermelon","Pear","Grape","Pineapple","Strawberry","Cherry","Mango"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//陣列中的資料無法直接傳遞給ListView,需要借助配接器來完成
//ArrayAdapter可以通過泛型指定要適配的資料型別
//三個引數
//第一個引數為當前背景關系
//第二個引數為ListView的子項id,simple_list_item_1為Android內置的布局檔案,里面只有一個TextView
//第三個引數為要適配的資料
ArrayAdapter<String> adapter = new ArrayAdapter<>(MainActivity.this,android.R.layout.simple_list_item_1,data);
ListView listView = (ListView)findViewById(R.id.list_view);
//將ListView和資料進行關聯
listView.setAdapter(adapter);
}
}
定制ListView的界面
fruit.xml檔案:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/fruit_image"></ImageView>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/fruit_name"
android:layout_marginLeft="10dp"
android:layout_gravity="center_vertical"></TextView>
</LinearLayout>
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/list_view"></ListView>
</LinearLayout>
Fruit類
package com.example.listviewtest;
public class Fruit {
//水果名稱
private String name;
//水果對應的圖片資源id
private int imageId;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public int getImageId() {
return imageId;
}
public void setImageId(int imageId) {
this.imageId = imageId;
}
public Fruit(String name, int imageId) {
this.name = name;
this.imageId = imageId;
}
}
FruitAdapter類:
package com.example.listviewtest;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;
public class FruitAdapter extends ArrayAdapter<Fruit> {
private int resourceId;
//FruitAdapter重寫了父類的一組建構式,用于將背景關系、ListView子項布局的id和資料都傳遞進來,
public FruitAdapter(Context context, int textViewResourceId, List<Fruit> objects){
super(context,textViewResourceId,objects);
resourceId = textViewResourceId;
}
//這個函式在每個子項被滾動到螢屏內的時候被呼叫
@Override
public View getView(int position, View convertView, ViewGroup parent){
Fruit fruit = getItem(position);//獲取當前項的Fruit物件
//使用LayoutInflater來為這個子項加載我們傳入的布局,
//第三個引數是false,表示只讓我們在父布局中宣告的layout屬性生效,但不為這個View添加父布局,
//因為一旦有了父布局之后,他就不能再添加到ListView中了
View view = LayoutInflater.from(getContext()).inflate(resourceId, parent,false);
ImageView fruitImage = (ImageView)view.findViewById(R.id.fruit_image);
TextView fruitName = (TextView)view.findViewById(R.id.fruit_name);
fruitImage.setImageResource(fruit.getImageId());
fruitName.setText(fruit.getName());
return view;
}
}
MainActivity:
package com.example.listviewtest;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private String[] data = {"Apple","Banana","Orange","Watermelon","Pear","Grape","Pineapple","Strawberry","Cherry","Mango","Apple","Banana","Orange","Watermelon","Pear","Grape","Pineapple","Strawberry","Cherry","Mango"};
private List<Fruit> fruitList = new ArrayList<>();
private void initFruits(){
for(int i = 0;i<2;i++){
Fruit apple = new Fruit("Apple",R.drawable.apple_pic);
fruitList.add(apple);
Fruit banana = new Fruit("Apple",R.drawable.banana_pic);
fruitList.add(banana);
Fruit orange = new Fruit("Apple",R.drawable.orange_pic);
fruitList.add(orange);
Fruit watermelon = new Fruit("Apple",R.drawable.watermelon_pic);
fruitList.add(watermelon);
Fruit pear = new Fruit("Apple",R.drawable.pear_pic);
fruitList.add(pear);
Fruit grape = new Fruit("Apple",R.drawable.grape_pic);
fruitList.add(grape);
Fruit pineapple = new Fruit("Apple",R.drawable.pineapple_pic);
fruitList.add(pineapple);
Fruit strawberry = new Fruit("Apple",R.drawable.strawberry_pic);
fruitList.add(strawberry);
Fruit cherry = new Fruit("Apple",R.drawable.cherry_pic);
fruitList.add(cherry);
Fruit mango = new Fruit("Apple",R.drawable.mango_pic);
fruitList.add(mango);
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initFruits();
//R.layout.fruit_item是一個整數
FruitAdapter adapter = new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList);
ListView listView = (ListView)findViewById(R.id.list_view);
listView.setAdapter(adapter);
}
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/yidong/287633.html
標籤:其他
上一篇:原生與Flutter通信
