安卓開(kāi)發(fā)UI設(shè)計(jì)的問(wèn)題以及解決方法
1. 頁(yè)面部分占用1/N的情況
解決方案;
使用線性布局，其屬性android:orientation="vertical"，android:weightSum="3"
線性布局里面有兩個(gè)相對(duì)布局，分別設(shè)置兩個(gè)相對(duì)布局的layout_weight

關(guān)于其中的權(quán)重比為2：1，參閱Android布局中的layout_weight和weightSum屬性的詳解及使用

<LinearLayout

android:orientation="vertical"
...
android:weightSum="3">
<!-- 上部 -->
<RelativeLayout
android:layout_weight="2"
android:id="@+id/top"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/colorPrimaryDark">
...
</RelativeLayout>
<!-- 中部和底部 -->
<RelativeLayout
android:id="@+id/middle"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent">
...
</RelativeLayout>
</LinearLayout>
2. 分割線的實(shí)現(xiàn)
分割線的實(shí)現(xiàn)，方法比較粗暴，直接使用ImageView組件實(shí)現(xiàn)
給其src設(shè)置為一個(gè)顏色，然后修改其weight(對(duì)應(yīng)分割線的寬度)以及height(對(duì)應(yīng)分割線的高度)屬性以及位置設(shè)置
<ImageView
android:id="@+id/horLine2"
android:layout_width="match_parent"
android:layout_height="15dp"
android:layout_below="@+id/info"
android:layout_marginTop="15dp"
android:src="#1E000000"/>
3. 多個(gè)組件高度一致，頂對(duì)齊，并且水平均勻分布
例子：需要實(shí)現(xiàn)下圖的情況，需要三個(gè)button高度一致，頂對(duì)齊并且水平均勻分布
在這里插入圖片描述
首先需要了解一下約束布局以其使用
約束布局（ConstraintLayout），布局內(nèi)組件按各種約束排列。每個(gè)組件受到三類約束，即其他組件，父容器(parent)，基準(zhǔn)線(GuideLine)。 約束布局代碼可歸納為以下形式：app:layout_constraint[組件本身的位置]_to[目標(biāo)位置]Of="[目標(biāo)id]"。因此若想要組件水平居中，只需設(shè)置組件的左右邊界與父容器的左右邊界分別對(duì)齊。同理，組件的垂直居中也可以這么設(shè)置。
再思考本問(wèn)題，是否也能使用約束布局來(lái)完成呢？使用約束布局，將三個(gè)按鈕放在一個(gè)約束布局里面，每個(gè)按鈕視圖的左側(cè)或者右側(cè)與需要的對(duì)齊按鈕的相應(yīng)側(cè)對(duì)齊即可，則組件之間就可以處于均勻分布了。
<android.support.constraint.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
app:layout_constraintRight_toLeftOf="@+id/loadBtn"
app:layout_constraintLeft_toLeftOf="parent"
android:id="@+id/saveBtn"
android:text="SAVE"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:id="@+id/loadBtn"
android:text="LOAD"
app:layout_constraintLeft_toRightOf="@+id/saveBtn"
app:layout_constraintRight_toLeftOf="@+id/clearBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toRightOf="@+id/loadBtn"
app:layout_constraintRight_toRightOf="parent"
android:id="@+id/clearBtn"
android:text="CLEAR"/>
</android.support.constraint.ConstraintLayout>
安卓UI界面設(shè)計(jì)的方式；
用戶界面在程序開(kāi)發(fā)中十分重要，一個(gè)好的用戶界面設(shè)計(jì)需要考慮到用戶使用體驗(yàn)、是否美觀方便等。在界面設(shè)計(jì)的過(guò)程中，需要考慮如何制作出UI界面，怎么樣控制UI界面兩大塊。
本文主要介紹通過(guò)兩種方式來(lái)進(jìn)行界面設(shè)計(jì)：
1、通過(guò)xml文件進(jìn)行界面設(shè)計(jì)
2、通過(guò)代碼控制進(jìn)行界面設(shè)計(jì)
一、通過(guò)xml文件進(jìn)行界面設(shè)計(jì)
打開(kāi)Android Studio，建立工程，在res/layout下存放的是界面布局文件。雙擊創(chuàng)建的文件，左邊是界面設(shè)計(jì)，右邊對(duì)應(yīng)了界面設(shè)計(jì)的xml文本。
1>在左邊控件中，拖動(dòng)一個(gè)button到右邊的手機(jī)界面中，之后點(diǎn)擊上線畫(huà)圈右邊的text查看文本，可以看到xml已經(jīng)編寫(xiě)完成。
2>切換到代碼目錄，打開(kāi)之前創(chuàng)建的MainActivity，在onCreate()方法中：
setContentView(R.layout.activity_main); //將編寫(xiě)的界面顯示到手機(jī)屏幕
MainActivity添加兩個(gè)私有數(shù)據(jù)成員：
private TextView tv;
private Button bt;
onCreate()里面初始化tv和bt，并給bt添加監(jiān)聽(tīng)事件
tv = (TextView)findViewById(R.id.textView);//控件初始化
bt = (Button) findViewById(R.id.button);//控件初始化
bt.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
tv.setText("你點(diǎn)擊了按鈕!");
}
);//添加監(jiān)聽(tīng)
運(yùn)行程序，點(diǎn)擊按鈕，原來(lái)的hello world！文本發(fā)生改變。在這里，兩個(gè)控件都是通過(guò)xml文件定義的，我們?cè)诖a中實(shí)現(xiàn)了一個(gè)監(jiān)聽(tīng)器，也就是界面的控制邏輯。
實(shí)例：
通過(guò)代碼進(jìn)行界面設(shè)計(jì)時(shí)，我們建立一個(gè)TextView控件來(lái)寫(xiě)標(biāo)題；建立一個(gè)ImageView控件來(lái)寫(xiě)標(biāo)題。先將圖片復(fù)制到res/drawable目錄下，然后通過(guò)app:srcCompat=”@drawable/sysu”來(lái)引用；建立兩個(gè)TextView控件，用來(lái)寫(xiě)“學(xué)號(hào)”和“密碼”，設(shè)置建立兩個(gè)EditView控件，用來(lái)輸入學(xué)號(hào)和密碼；建立一個(gè)RadioGroup，之后再在里面建立兩個(gè)單選按鈕RadioButton。

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="com.example.yc.sysu.MainActivity">
<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="學(xué)生信息系統(tǒng)"
android:textSize="20sp"
android:textColor="#000000"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginTop="20dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<ImageView
android:id="@+id/icon"
android:layout_width="104dp"
android:layout_height="104dp"
app:srcCompat="@drawable/sysu"
app:layout_constraintTop_toBottomOf="@id/title"
android:layout_marginTop="20dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
<TextView
android:id="@+id/user_id"
android:text="學(xué)號(hào)："
android:textColor="#000000"
android:textSize="18sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginLeft="20dp"
app:layout_constraintTop_toBottomOf="@id/icon"
android:layout_marginTop="20dp" />
<TextView
android:id="@+id/user_pwd"
android:text="密碼："
android:textColor="#000000"
android:textSize="18sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
android:layout_marginLeft="20dp"
app:layout_constraintTop_toBottomOf="@id/user_id"
android:layout_marginTop="20dp"/>
<EditText
android:id="@+id/text_userid"
android:hint="請(qǐng)輸入學(xué)號(hào)"
android:textColor="#000000"
android:textSize="18sp"
android:paddingTop="0dp"
android:digits="0123456789"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="@id/user_id"
app:layout_constraintLeft_toRightOf="@+id/user_id"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginRight="20dp"/>
<EditText
android:id="@+id/text_userpwd"
android:hint="請(qǐng)輸入密碼"
android:textColor="#000000"
android:textSize="18sp"
android:password="true"
android:paddingTop="0dp"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="@id/user_pwd"
app:layout_constraintLeft_toRightOf="@+id/user_pwd"
app:layout_constraintRight_toRightOf="parent"
android:layout_marginRight="20dp" />
<RadioGroup
android:id="@+id/radioButton"
android:orientation="horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="@id/user_pwd"
android:layout_marginTop="30dp">
<RadioButton
android:id="@+id/radioButton1"
android:text="學(xué)生"
android:textColor="#000000"
android:textSize="18sp"
android:checked="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<RadioButton
android:id="@+id/radioButton2"
android:text="教職工"
android:textColor="#000000"
android:textSize="18sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"/>
</RadioGroup>
<View
android:id="@+id/button_box"
android:layout_height="50dp"
android:layout_width="185dp"
app:layout_constraintTop_toBottomOf="@id/radioButton"
android:layout_marginTop="20dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"/>
<Button
android:id="@+id/button1"
android:text="登錄"
android:textColor="#ffffff"
android:background="@drawable/shape"
android:textSize="18sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="@id/button_box"
app:layout_constraintTop_toTopOf="@id/button_box" />
<Button
android:id="@+id/button2"
android:text="注冊(cè)"
android:textColor="#ffffff"
android:background="@drawable/shape"
android:textSize="18sp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintLeft_toRightOf="@id/button1"
android:layout_marginLeft="10dp"
app:layout_constraintTop_toTopOf="@id/button_box"/>
</android.support.constraint.ConstraintLayout>
shape.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle"> <solid android:color="#3f51b5"/> <corners android:radius="10dip"/> <padding
android:bottom="5dp"
android:top="5dp"
android:left="10dp"
android:right="10dp"/> </shape>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#3f51b5"/>
<corners android:radius="10dip"/>
<padding
android:bottom="5dp"
android:top="5dp"
android:left="10dp"
android:right="10dp"/>
</shape>
二、通過(guò)代碼進(jìn)行界面設(shè)計(jì)
定義MainActivity的私有成員：
private TextView tv;
private Button bt;
重寫(xiě)onCreate()，通過(guò)new定義一個(gè)線性布局和Button按鈕和文本框控件，布局里面加入控件，控件加上監(jiān)聽(tīng)事件
LinearLayout l = new LinearLayout(this); //定義線性布局
setContentView(l); //線性布局加入屏幕
tv = new TextView(this); //定義控件
bt = new Button(this); //定義控件
l.addView(bt); //加入布局
l.addView(tv); //加入布局
bt.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
tv.setText("你點(diǎn)擊了按鈕!");
}
}); //監(jiān)聽(tīng)事件
運(yùn)行代碼，點(diǎn)擊按鈕，將會(huì)出現(xiàn)”你點(diǎn)擊了按鈕!”的文本提示。

當(dāng)前題目：Android開(kāi)發(fā)UI設(shè)計(jì)問(wèn)題解決方法
文章分享：http://jinyejixie.com/news24/131174.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁(yè)設(shè)計(jì)公司、網(wǎng)站排名、定制開(kāi)發(fā)、網(wǎng)站內(nèi)鏈、網(wǎng)站收錄、軟件開(kāi)發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)