詳解Android Studio實現使用者登陸介面demo(xml實現)
阿新 • • 發佈:2020-05-14
使用Android Studio 編寫的第一個demo,使用佈局檔案—xml實現使用者登入介面
注:所建工程均為Android 6.0 所以只要是Android 6.0(包括6.0)以上的真機,模擬機都可以使用
Step1:Android Studio 開發環境的搭建:
1.安裝JDK (1.8);
2.安裝Android studio (3.3.1) 包含 gradle、sdk manage 、avd manage ;
3.使用sdk manage 下載安裝 sdk;
4.使用avd manages 建立虛擬機器
Step2: 新建工程專案Myapp2.0
1.在res/layout/activity_main.xml中編寫佈局內容:
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:paddingLeft="55px" android:paddingRight="50px" tools:context=".MainActivity"> <TextView android:id="@+id/message" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="@dimen/activity_horizontal_margin" android:layout_marginLeft="@dimen/activity_horizontal_margin" android:layout_marginTop="@dimen/activity_vertical_margin" android:text="Hello Word!" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintTop_toTopOf="parent" /> <View android:layout_width="match_parent" android:layout_height="2px" android:layout_marginTop="16px" android:background="#000000" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="28dp" android:layout_gravity="center_horizontal" android:layout_marginTop="20px" android:text="登陸介面" /> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" > <EditText android:id="@+id/et1" android:layout_width="280dp" android:layout_height="wrap_content" android:layout_marginTop="30dp" android:paddingLeft="10dp" android:hint="請輸入賬號" android:inputType="text"/> <ImageView android:id="@+id/bt1" android:layout_width="25dp" android:layout_height="25dp" android:layout_marginTop="37dp" android:src="@drawable/delete" /> </LinearLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:paddingLeft="8px"> <EditText android:id="@+id/et2" android:layout_width="280dp" android:layout_height="wrap_content" android:layout_marginTop="26dp" android:hint="請輸入密碼" android:inputType="textPassword" /> <ImageView android:id="@+id/bt2" android:layout_width="25dp" android:layout_height="25dp" android:layout_marginTop="33dp" android:src="@drawable/delete" /> </LinearLayout> <Button android:id="@+id/btn_login" android:layout_width="match_parent" android:layout_height="48dp" android:background="@color/bbutton_danger_disabled_edge" android:layout_marginTop="30dp" android:text="登 陸" android:textSize="30dp" android:textColor="@color/bbutton_danger"/> <Button android:id="@+id/bbt1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="15dp" android:layout_gravity="right" android:layout_marginTop="20px" android:background="@color/bbutton_danger" android:text="Adapter" /> </LinearLayout>
2.建立一個Java class —ExitTextUtils用於封裝清空輸入框的內容 :
/** * 用於實現點選叉叉時,清空輸入框的內容 */ class EditTextUtils { public static void clearButtonListener(final EditText et,final View view) { // 取得et中的文字 String etInputString = et.getText().toString(); // 根據et中是否有文字進行X可見或不可見的判斷 if (TextUtils.isEmpty(etInputString)) { view.setVisibility(View.INVISIBLE); } else { view.setVisibility(View.VISIBLE); } //點選X時使et中的內容為空 view.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { et.setText(""); et.requestFocusFromTouch(); } }); //對et的輸入狀態進行監聽 et.addTextChangedListener(new TextWatcher() { @Override public void onTextChanged(CharSequence s,int start,int before,int count) { } @Override public void beforeTextChanged(CharSequence s,int count,int after) { } @Override public void afterTextChanged(Editable s) { if (s.length() == 0) { view.setVisibility(View.INVISIBLE); } else { view.setVisibility(View.VISIBLE); } } }); } }
3.在MainActivity.java 裡書寫程式碼:
private TextView mTextMessage; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); EditText et1 = (EditText) findViewById(R.id.et1); EditText et2 = (EditText) findViewById(R.id.et2); View bt = findViewById(R.id.bt1); View iv = findViewById(R.id.bt2); EditTextUtils.clearButtonListener(et1,bt); EditTextUtils.clearButtonListener(et2,iv); Button btn1 = (Button) findViewById(R.id.bbt1); btn1.setOnClickListener(new View.OnClickListener(){ @Override public void onClick(View v){ //Intent是一種執行時繫結(run-time binding)機制,它能在程式執行過程中連線兩個不同的元件,在存放資原始碼的資料夾下下, Intent i = new Intent(MainActivity.this,Main2ActivityAdapterDemo.class); //啟動 startActivity(i); } }); mTextMessage = (TextView) findViewById(R.id.message); BottomNavigationView navigation = (BottomNavigationView) findViewById(R.id.navigation); navigation.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener); }
4.佈局使用到的資源:
自己建的用於存放自定義的檔案 dimens.xml
<resources> <!-- Default screen margins,per the Android Design guidelines. --> <dimen name="activity_horizontal_margin">16dp</dimen> <dimen name="activity_vertical_margin">16dp</dimen> <dimen name="text_size_16">22dp</dimen> <dimen name="space_8">8</dimen> <dimen name="space_16">16</dimen> <dimen name="fab_margin">16dp</dimen> </resources>
color.xml
<?xml version="1.0" encoding="utf-8"?> <resources> <color name="colorPrimary">#008577</color> <color name="colorPrimaryDark">#00574B</color> <color name="colorAccent">#D81B60</color> <color name="main_gray">#CCCCCC</color> <color name="main_black">#000000</color> <color name="bbutton_danger_disabled_edge">#00CC33</color> <color name="bbutton_danger">#FFFFFF</color> </resources>
截圖
Step3:執行程式。。。截圖如下:
下載地址:[LoginDemo.zip]
到此這篇關於詳解Android Studio實現使用者登陸介面demo(xml實現)的文章就介紹到這了,更多相關Android Studio使用者登陸內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!