AndroidGUI26:程式中動態設定元件的寬度、高度以及margin等屬性
注意:元件和控制元件是有區別的。元件對應的英文是component,控制元件對應的英文是control;控制元件是帶有介面的,元件則未必有介面;控制元件屬於元件,可以說它是帶有介面的元件。比如Button有介面,因此可以說它是控制元件,也可以說它是元件。LinearLayout沒有介面,因此它不能算是控制元件,但它卻是元件。本文中由於涉及了帶有和不帶有介面的元件,因此,用元件泛指這兩者。
有些元件,比如Button,可以在程式中用setWidth和setHeight來設定其大小,這是非常方便的。但有些元件卻沒有這兩個設定大小的方法,比如ImageButton、Spinner以及LinearLayout等等,那麼如何在程式中根據需要,動態地設定他們的大小呢?下面就用實際的例子來說明這個問題。
1. 首先建立一個Android專案:
2. 將圖片檔案magnifier.png拖入到專案的res/drawable-mdpi資料夾下。mangifier.png的內容如下:
3. 在strings.xml中,增加如下粗體字程式碼。這些程式碼,將會被Spinner使用:
<string name="spin_prompt">請選擇城市 </string>
<string-array name="cities">
<item>北京 </item >
<item>上海 </item >
<item>南京 </item >
<item>烏魯木齊 </item>
<item>哈爾濱 </item>
<item>符拉迪沃斯託克 </item>
</string-array>
4. 修改main.xml,使之如下:
<?xml version="1.0"encoding="utf-8"?>
<LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<Buttonandroid:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/hello"
/>
<ImageButtonandroid:id="@+id/image_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/magnifier"
/>
<Spinnerandroid:id="@+id/sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:entries="@array/cities"
android:prompt="@string/spin_prompt"
/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<LinearLayoutandroid:id="@+id/ll_left"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello"
/>
</LinearLayout>
<LinearLayoutandroid:id="@+id/ll_right"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="right"
>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Android"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
不難看出,mainx.ml有一個Button,一個ImageButton,一個Spinner和兩個EditText。
5. 執行本專案,得到的結果如下:
現在假定,我們要:
a) 增加Button的高度
b) 增加ImageButton的寬度和高度
c) 增加Spinner的寬度
d) 將包含Hello的EditText靠左,包含Android的EditText靠右
6. 修改AdjustControlSize.java的程式碼,使之如下:
public class AdjustControlSize extends Activity
{
private Button btn;
private ImageButton imagebtn;
private Spinner sp;
private LinearLayout ll_left;
private LinearLayout ll_right;
private DisplayMetrics dm;
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// 獲取螢幕尺寸
dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
btn = (Button)findViewById(R.id.btn);
imagebtn = (ImageButton)findViewById(R.id.image_btn);
sp =(Spinner)findViewById(R.id.sp);
ll_left = (LinearLayout)findViewById(R.id.ll_left);
ll_right = (LinearLayout)findViewById(R.id.ll_right);
// 增加Button的高度,可以很方面地通過setHeight方法來實現。
btn.setHeight(80);
// 但如果要想在程式碼中改變某些元件,比如ImageButton、Spinner以及LinearLayout,
// 用setHeight或者setWidth的方式就不行了,因為這些元件中,沒有提供這兩個方法。
// 為此,可以通過LayoutParams這個類(這裡我們用LinearLayout.LayoutParams)來實現這一點。
// 改變imagebtn的寬度和高度均為螢幕寬度的1/4
LinearLayout.LayoutParams imagebtn_params = newLinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
imagebtn_params.height = dm.widthPixels / 4;
imagebtn_params.width = dm.widthPixels / 4;
imagebtn.setLayoutParams(imagebtn_params);
// 設定sp的寬度為螢幕寬度的2/3
LinearLayout.LayoutParams sp_params = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
sp_params.width = dm.widthPixels * 2 / 3;
sp.setLayoutParams(sp_params);
// 讓兩個EditText分別處於螢幕的左右兩端。
// 在main.xml中,兩個EditText分別處於ll_left和ll_right這兩個LinearLayout中,且
// 處於ll_left的gravity屬性為left,即置於其中的元件靠左;處於ll_right的gravity
// 屬性為right,即置於其中的元件靠右。但是由於這兩個LinearLayout的寬度屬性均為
// wrap_content,所以它們靠在一起了,由此導致了兩個EditText也靠在一起。
// 如果,我們把ll_left和ll_right的寬度能夠設定為螢幕寬度的一半,那麼兩個EditText就
// 會分別處於螢幕的兩端。
LinearLayout.LayoutParams ll_params = new LinearLayout.LayoutParams(
LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
ll_params.width = dm.widthPixels / 2;
ll_left.setLayoutParams(ll_params);
ll_right.setLayoutParams(ll_params);
}
}
7. 執行結果:
達到了我們在5中假定的目標。
8. 總結
如果在程式中不能用setWidth和setHeight來改變大小的元件,通常可以通過LayoutParams的方式進行設定,正如6中程式碼的粗體字部分的程式碼那樣。動態設定這些元件的margin也是採用類似的方式,比如:
sp_params.width = dm.widthPixels * 2 / 3;
sp_params.leftMargin = 6; // 用這種方式設定元件的margin
sp.setLayoutParams(sp_params);