携帯端末開発実験5 - ダイアログボックスの使い方

モバイル 2023-04-09 03:39:37 訪問数: null

運用実績

 

目的

  1. Toast コンポーネントの使用をマスターします。
  2. AertDialog コンポーネントの使用法をマスターします。
  3. ダイアログ ボタン リスナーの使用をマスターします。
  4. インターフェイス設計にさまざまなレイアウト マネージャーとコントロールを巧みに適用できる。

実験内容と手順

            アプリのログインおよび登録機能を設計し、ログイン インターフェイスの [ログイン] ボタンをクリックして、入力されたユーザー名とパスワードを確認します (要件: ユーザー名は、電子メール形式に準拠した電子メール アドレスでログインする必要があります)。 ; パスワードは文字、数字、および記号の組み合わせで、文字で始まる必要があります)、形式の要件を満たさないトースト コンポーネントのプロンプト; ログイン インターフェイスの [登録] ボタンをクリックすると、登録ダイアログ ボックスが表示されます。登録操作のポップアップが表示されます (ダイアログ ボックスの [OK] ボタンと [キャンセル] ボタンは、現時点ではイベント処理を必要としません)。

ステップ：

  • ログイン レイアウト ファイルactivity_login.xmlと登録レイアウト ファイルactivity_register.xmlをLayoutフォルダに作成します。
  • ログイン認証を行うための「ログイン」ボタンのクリックイベントを記述します（コードの一部を以下に示します。完成させてください）。
  • 「登録」ボタンのクリックイベントを記述し、登録インターフェースの表示を実現します（コードの一部を以下に示しますので、完成させてください）

参考文献:

( 1 ) 以下はdrawableファイルで、 drawableフォルダーにコピーする必要があります。
hat.png: 登録アイコン
login_logo.png: ログイン アイコン

画像リソースリンク 抽出コード：1234

Button register_btn = findViewById(R.id.register_btn);
Button login_btn = findViewById(R.id.login_btn);

register_btn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        RelativeLayout loginForm = (RelativeLayout) getLayoutInflater()
                .inflate(R.layout.activity_register, null);

//创建AlertDialog并显示，设置布局文件为activity_register、图标为hat.png、标题为“快速注册”、按钮包括“取消”和“注册”
           }
});

login_btn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        TextView t1=findViewById(R.id.login_password);
        Pattern pattern = Pattern.compile("[_0-9a-z]+");
        boolean tf = pattern.matcher(t1.getText()).matches();
        if(!tf) {

            //创建Toast提示“密码格式错误”，设置显示位置“居中显示”、字体颜色“红色”、显示时间3.5秒（Toast.LENGTH_LONG）
        }
    }
});

1. 画像を対応するフォルダにコピーします

 2. 新しいレイアウト ファイルを作成する

 そして、register_layout.xml という名前を付けます (命名は将来一貫する予定です)。

3. activity_main.xml で、ログインおよび登録用のホームページ レイアウトを作成します。

 【参照コード】

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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=".MainActivity"
    android:orientation="vertical"
    android:gravity="center">
<!--    logo-->
    <ImageView
        android:id="@+id/img"
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:src="@drawable/login_logo"
        android:scaleType="centerCrop"
        android:layout_gravity="center_horizontal"/>
<!--    账号-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/zh_tv"
            android:layout_below="@+id/img"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:textSize="20dp"
            android:text="账号："/>
        <EditText
            android:id="@+id/zh_et"
            android:layout_width="200dp"
            android:layout_height="60dp"
            android:hint="请输入账号（email）"
            android:inputType="textEmailAddress"
            android:singleLine="true"/>
    </LinearLayout>
<!--    密码-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/ps_tv"
            android:layout_below="@+id/zh_tv"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:textSize="20dp"
            android:text="密码："/>
        <EditText
            android:id="@+id/ps_et"
            android:layout_below="@+id/zh_et"
            android:layout_toRightOf="@+id/ps_tv"
            android:layout_width="200dp"
            android:layout_height="60dp"
            android:hint="请输入密码"
            android:inputType="textPassword"
            android:singleLine="true"/>
    </LinearLayout>
<!--    登录、注册按钮-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <Button
            android:id="@+id/login_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="登录"/>
        <Button
            android:layout_marginLeft="80dp"
            android:id="@+id/register_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="注册"/>
    </LinearLayout>

</LinearLayout>

 4. register_layout.xml でダイアログ ボックスの内部レイアウトを作成します。

 【参照コード】

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:gravity="center"
    android:layout_marginTop="20dp">
<!--    昵称-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/nc_tv"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:text="昵称："
            android:textSize="20dp"/>
        <EditText
            android:id="@+id/nc_et"
            android:layout_width="200dp"
            android:layout_height="60dp"
            android:hint="请输入用户名" />
    </LinearLayout>
<!--    账号-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/zh_tv"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:text="账号："
            android:textSize="20dp"/>
        <EditText
            android:id="@+id/zh_et"
            android:layout_width="200dp"
            android:layout_height="60dp"
            android:hint="请输入正确的邮箱"
            android:inputType="textEmailAddress"/>
    </LinearLayout>
<!--    密码-->
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/ps_tv"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:text="密码："
            android:textSize="20dp"
            />
        <EditText
            android:id="@+id/ps_et"
            android:layout_width="200dp"
            android:layout_height="60dp"
            android:hint="请输入密码"
            android:inputType="textPassword"/>
    </LinearLayout>

</LinearLayout>

後で Java コードがダイアログ ボックスのタイトル バーを設定するため、タイトルを作成する必要はありません。

5.JAVAコードを書く

【参照コード】

package com.example.a111;

import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;

import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;

import java.util.regex.Pattern;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Button register_btn = findViewById(R.id.register_btn);
        Button login_btn = findViewById(R.id.login_btn);

        register_btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                LinearLayout loginForm = (LinearLayout) getLayoutInflater()
                        .inflate(R.layout.register_layout, null);
//创建AlertDialog并显示，设置布局文件为activity_register、图标为hat.png、标题为“快速注册”、按钮包括“取消”和“注册”
                AlertDialog.Builder builder=new AlertDialog.Builder(MainActivity.this);
                builder.setIcon(R.drawable.hat)
                        .setTitle("快速注册")
                        .setView(loginForm)
                        .setNegativeButton("取消",null)
                        .setPositiveButton("注册",null)
                        .create()
                        .show();
            }
        });

        login_btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                TextView t1=findViewById(R.id.ps_et);
                Pattern pattern = Pattern.compile("[_0-9a-z]+");
                boolean tf = pattern.matcher(t1.getText()).matches();
                if(!tf) {
                    //创建Toast提示“密码格式错误”，设置显示位置“居中显示”、字体颜色“红色”、显示时间3.5秒（Toast.LENGTH_LONG）
                    Toast toast=new Toast(MainActivity.this);
                    toast.setGravity(Gravity.CENTER,0,0);
                    TextView textView=new TextView(MainActivity.this);
                    textView.setTextSize(14f);
                    textView.setTextColor(Color.RED);
                    textView.setText("密码格式错误");
                    toast.setDuration(Toast.LENGTH_LONG);
                    toast.setView(textView);
                    toast.show();
                }
            }
        });

    }
}

【コード解説】

1. AlertDialog を作成して表示し、レイアウト ファイルを activity_register、アイコンを hat.png、タイトルを「クイック登録」、ボタンに「キャンセル」と「登録」を設定します。

AlertDialog.Builder builder=new AlertDialog.Builder(MainActivity.this);
                builder.setIcon(R.drawable.hat)
                        .setTitle("快速注册")
                        .setView(loginForm)
                        .setNegativeButton("取消",null)
                        .setPositiveButton("注册",null)
                        .create()
                        .show();

おすすめ

転載: blog.csdn.net/m0_52177571/article/details/127712733
おすすめ
中国人プログラマーの「35歳の呪い」
Lanya CorelDRAW プラグイン 2024.5.1 国際労働者の日バージョン、無料ダウンロード
ランキング
ループコントローラ
スピーカーの分類（スピーカーDiarisation）
雑音除去空気とフロートを除去するための統計的フィルタリング方法を使用して
Spring Cloudプロジェクトの構築（5）
Echarts去掉图形后面的网格线
【レジャー・楽しみ】C言語でクリスマスツリーを描く方法
ゲームが反映するように、後に＃589（本部2）ラウンドCodeforces
アレイの重複排除について知っているソリューションはいくつありますか？
NetBackupの証明書の有効期限は-nBuエラー8506に近づきます
Dockerコンテナの起動パラメータを表示する
アーカイブ
もっと
2024-05-04(18)
2024-05-03(8)
2024-05-02(0)
2024-05-01(4)
2024-04-30(35)
2024-04-29(5)
2024-04-28(12)
2024-04-27(29)
2024-04-26(22)
2024-04-25(31)

コードワールド

© 2018 codetd.com