Boki Web Dev Engineer

ListDialog를 써서 사용자 정보 입력 앱 만들기

2019-12-08
boki

listDialog를 이용한다

미리 자신이 준비한 그림파일들을 drawble 폴더에 넣어주자

파일 Ctrl+C 해주고 자기만의 IDE에서 drawable 폴더를 선택한 채로 Ctrl+V해주면 된다

  • 이름을 클릭하면 원본 크기로 파일을 다운받을 수 있다

icon1 icon1

image

image

  • 추가로 dialog1.xml, toast1.xml을 만들어준다 image

dialog1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView android:text="사용자 이름"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <EditText android:id="@+id/dlgEdt1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <TextView android:text="이메일"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
    <EditText android:id="@+id/dlgEdt2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />
</LinearLayout>

toast1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:background="#FF0000"
    android:gravity="center">
    <ImageView android:src="@drawable/icon1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <TextView android:id="@+id/toastText1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="TextView"
        android:textSize="20dp"/>

    <ImageView android:src="@drawable/icon1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
</LinearLayout>

`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_horizontal">

    <TextView android:id="@+id/tvName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="사용자 이름"/>
    <TextView android:id="@+id/tvEmail"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="이메일"/>
    <Button android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="여기를 클릭"/>
</LinearLayout>

package 부분은 개개인마다 다르므로 import 구문부터 복사하는 것을 권장한다

추가로 MainActivity이름도 다를 수 있기때문에 주의해서 복사하고, 복사보다는 직접 쳐보는 것을 권장하는 바이다

MainActivity.java

package com.example.boki.listdialog;

import android.content.DialogInterface;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity {

    TextView tvName, tvEmail;
    Button button1;
    EditText dlgEdtName, dlgEdtEmail;
    TextView toastText;
    View dialogView, toastView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        setTitle("사용자 정보 입력");

        tvName = (TextView)findViewById(R.id.tvName);
        tvEmail = (TextView)findViewById(R.id.tvEmail);
        button1 = (Button)findViewById(R.id.button1);
        button1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                dialogView = (View)View.inflate(MainActivity.this, R.layout.dialog1, null); // dialog1.xml파일을 inflate하여 dialogView에 대입
                AlertDialog.Builder dlg = new AlertDialog.Builder(MainActivity.this);
                dlg.setTitle("사용자 정보 입력");
                dlg.setIcon(R.drawable.icon1);
                dlg.setView(dialogView); // 인플레이트한 뷰를 대화상자로 사용
                dlg.setPositiveButton("확인", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        dlgEdtName = (EditText)dialogView.findViewById(R.id.dlgEdt1);
                        dlgEdtEmail = (EditText)dialogView.findViewById(R.id.dlgEdt2);
                        tvName.setText(dlgEdtName.getText().toString());
                        tvEmail.setText(dlgEdtEmail.getText().toString());
                    }
                });
                dlg.setNegativeButton("취소", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        Toast toast = new Toast(MainActivity.this);
                        toastView = (View)View.inflate(MainActivity.this, R.layout.toast1, null); // toast1.xml파일을 inflate하여 toastView에 대입
                        toastText = (TextView)toastView.findViewById(R.id.toastText1);
                        toastText.setText("취소했습니다");
                        toast.setView(toastView);
                        toast.show();
                    }
                });
                dlg.show();
            }
        });
    }
}

결과 화면

image

image

image

image


Comments

Content