Android 開發:(三)安卓常用控制元件以及仿《微門戶》登入介面實現
阿新 • • 發佈:2018-11-01
一、常用控制元件:
1、文字類控制元件
TextView 負責展示文字,非編輯
EditText 可編輯文字控制元件
2、按鈕類控制元件
Button 按鈕
ImageButton 圖片按鈕
RadioButton與RadioGroup 單選按鈕
CheckBox 複選按鈕
3、圖片控制元件
ImageView 負責顯示圖片
控制元件詳解可以參考:http://blog.csdn.net/netdxy/article/details/50691915
二、登入介面實現:
1.效果圖:
2.程式碼示例:
activity_login.xml:
<LinearLayout
android:id="@+id/userName"
android:layout_width="match_parent"
android:layout_height="50dp">
<ImageButton
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginTop="10dp"
android:background ="#000000" />
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/username"
android:layout_marginLeft="10dp"
android:layout_marginTop="3dp"
android:hint="請輸入使用者名稱" />
</LinearLayout >
<LinearLayout
android:id="@+id/passWord"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="@id/userName">
<ImageButton
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginTop="10dp"
android:background="#000000" />
<EditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/password"
android:layout_marginLeft="10dp"
android:layout_marginTop="3dp"
android:password="true"
android:hint="請輸入密碼"
/>
</LinearLayout>
/*RadioGroup搭配RadioButton
RadioGroup是單選組合框,可以容納多個RadioButton的容器.在沒有RadioGroup的情況下,RadioButton可以全部都選中;當多個RadioButton被RadioGroup包含的情況下,RadioButton只可以選擇一個。並用setOnCheckedChangeListener來對單選按鈕進行監聽
*/
<RadioGroup
android:id="@+id/rg"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="@id/passWord" //相對佈局(在xxx下面開始)
android:orientation="horizontal"> //橫向佈局
<RadioButton
android:id="@+id/personal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:layout_marginTop="10dp"
android:layout_weight="1" //平分空間大小
android:checked="true" //預設選中
android:text="個人登入"/>
<RadioButton
android:id="@+id/legal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1"
android:text="法人登入"/>
</RadioGroup>
<Button
android:layout_width="match_parent"
android:layout_height="45dp" //長寬大小:dp
android:layout_marginTop="10dp"
android:layout_below="@id/rg"
android:id="@+id/loginBtn"
android:text="登入"
android:background="@drawable/shape" //button圓角設定,具體步驟見下節。
android:textSize="19sp" //字型大小:sp
android:textColor="#ffffff" />
LoginActivity:
public class LoginActivity extends AppCompatActivity {
private Button loginBtn;
private EditText userName;
private EditText passWord;
private RadioGroup radioGroup;
private RadioButton radioButton;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_login);
userName = (EditText) findViewById(R.id.username);
passWord = (EditText) findViewById(R.id.password);
//給radioGroup新增點選事件
radioGroup = (RadioGroup) findViewById(R.id.rg);
radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup radioGroup, int i) {
//通過getCheckedRadioButtonId()獲取點選的radiobutton
int rgId = radioGroup.getCheckedRadioButtonId();
radioButton = (RadioButton) findViewById(rgId);
}
});
//點選登入
loginBtn = (Button) findViewById(R.id.loginBtn);
loginBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//通過getText()獲取控制元件值
String usernameStr = userName.getText().toString();
String passwordStr = passWord.getText().toString();
String loginTypeStr = radioButton.getText().toString();
if (loginTypeStr.equals("個人登入")) {
//alert提示框
Dialog alertDialog = new AlertDialog.Builder(LoginActivity.this).
setTitle("登入狀態").
setMessage("成功!").
create();
alertDialog.show();
}else {
Dialog alertDialog = new AlertDialog.Builder(LoginActivity.this).
setTitle("登入狀態").
setMessage("失敗!").
create();
alertDialog.show();
}
}