Androd 사용자 정의 대화 상자 Dialog 보기 및 매개 변수 전달 방법

오늘 은 사용자 정의 대화 상자 에 관 한 내용 을 말씀 드 리 겠 습 니 다.앞의 두 편 은 시스템 에서 제공 하 는 함 수 를 이용 하여 대화 상 자 를 만 들 고 있 지만 한계 가 너무 큽 니 다.보 기 를 정의 하려 면 시스템 함 수 를 이용 할 수 없습니다.사용자 정의 대화 상자 의 동쪽 이 필요 합 니 다.예전 에'안 드 로 이 드 의 Dialog 관련'을 한 편 쓴 적 이 있 는데 잘 못 썼 습 니 다.오늘 다시 한 편 써 드 리 겠 습 니 다.
초기 구축
먼저 이 소절 의 효과 도 를 보 여 드 리 겠 습 니 다.
그림%1 개의 캡 션 을 편 집 했 습 니 다.

1.Dialog 레이아웃
위의 그림 의 대화 상자 스타일 에 따라 Dialog 의 레이아웃 정의(customdialog.xml)

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 android:id="@+id/log_in_layout" 
 android:layout_width="fill_parent" 
 android:layout_height="wrap_content" 
 android:orientation="horizontal"> 
 <ImageView 
  android:layout_width="match_parent" 
  android:layout_height="100dip" 
  android:src="@drawable/animal1" 
  android:clickable="true" 
  android:layout_weight="1"/> 
 <ImageView 
  android:layout_width="match_parent" 
  android:layout_height="100dip" 
  android:src="@drawable/animal2" 
  android:clickable="true" 
  android:layout_weight="1"/> 
 <ImageView 
  android:layout_width="match_parent" 
  android:layout_height="100dip" 
  android:src="@drawable/animal3" 
  android:clickable="true" 
  android:layout_weight="1"/> 
 <ImageView 
  android:layout_width="match_parent" 
  android:layout_height="100dip" 
  android:src="@drawable/animal4" 
  android:clickable="true" 
  android:layout_weight="1"/> 
</LinearLayout> 
2,Dialog 에서 파생 대화 상자 클래스
구조 함수:
세 가지 구조 함수 가 있 습 니 다.지금 저 는 두 개 를 다시 썼 습 니 다.여 기 는 첫 번 째,즉 context 에 전달 하면 됩 니 다.
OnCreate 관련()
OnCreate()에 서 는 Layout Inflater 를 이용 하여 대화 상자 의 View 를 가 져 온 다음 SetContentView 를 이용 하여 사용자 정의 Dialog 류 의 레이아웃 으로 지정 합 니 다.

public class CustomDialog extends Dialog { 
 Context mContext; 
 public CustomDialog (Context context){ 
  super(context); 
  mContext = context; 
 } 
 public CustomDialog(Context context, int theme) { 
  super(context, theme); 
  mContext = context; 
 } 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  LayoutInflater inflater = (LayoutInflater) mContext 
    .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
  View layout = inflater.inflate(R.layout.custom_dialog, null); 
  this.setContentView(layout); 
 } 
} 
3.주 함수(MainActivity)
MainActivity 에서 사용자 가 클릭 할 때 사용자 정의 대화 상자 인 스 턴 스 를 팝 업 하 는 Button 을 씁 니 다.
MainActivity 의 레이아웃:(activitymain.xml)

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
 xmlns:tools="http://schemas.android.com/tools" 
 android:layout_width="match_parent" 
 android:layout_height="match_parent" 
 tools:context=".MainActivity"> 
 <Button 
  android:id="@+id/btn_pop_dialog" 
  android:layout_width="fill_parent" 
  android:layout_height="wrap_content" 
  android:text="     "/> 
</RelativeLayout> 
코드 처리:(MainActivity.java)
Btn 을 누 르 면 CustomDialog 클래스 의 인 스 턴 스 를 만 들 고 표시 합 니 다.

public class MainActivity extends Activity { 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.activity_main); 
  Button btn = (Button)findViewById(R.id.btn_pop_dialog); 
  btn.setOnClickListener(new View.OnClickListener() { 
   @Override 
   public void onClick(View view) { 
    CustomDialog dialog = new CustomDialog(MainActivity.this); 
    dialog.show(); 
   } 
  }); 
 } 
} 
이 부분의 원본 코드 는 문장의 맨 밑 에 제시 합 니 다.
2.정의 대화 상자 스타일
위 에 팝 업 된 대화 상 자 를 다시 한 번 살 펴 보 겠 습 니 다.

레이아웃 에서 우 리 는 하나의 수평 레이아웃 만 정 의 했 습 니 다.그 안에 네 개의 ImageView,즉 그 네 개의 작은 동물 을 넣 었 습 니 다.그 위 에 있 는 덩어리 는 어디서 났 습 니까?없 앨 수 있 을까요?이 절 에 우 리 는 양식 에 관 한 문 제 를 이야기 합 시다.
첫 번 째 문 제 는 위 에 있 는 모든 덩어리 만 있 습 니 다.대화 상자 스타일 을 지정 하지 않 았 기 때 문 입 니 다.시스템 은 기본 스타일 을 사용 합 니 다.그 덩어리 는 제목 표시 줄 입 니 다.
지 우려 면 사용자 정의 스타일 이 필요 합 니 다.
1.사용자 정의 스타일
저희 스타일 은 res/values 폴 더 에 적 힌 style.xml 파일 입 니 다.그림 과 같이 style.xml 이 없 으 면 새로 만 듭 니 다.위 치 는 그림 과 같 습 니 다.

여기 서 정의 하 는 스타일 코드 는 다음 과 같 습 니 다.

<style name="dialog" parent="android:Theme.Dialog"> 
 <item name="android:windowFrame">@null</item> 
 <item name="android:windowIsFloating">true</item> 
 <item name="android:windowContentOverlay">@null</item> 
 <item name="android:windowNoTitle">true</item> 
</style> 
먼저 이 몇 개의 매개 변수 에 대해 설명 하 세 요.
Android:windowFrame:인터페이스 에 대응 하 는 전경 그림;
안 드 로 이 드:window IsFloating:화면 에 떠 있 는 것 을 표시 합 니 다.여기 서 사용 하면 전체 layot 는 화면 중심 에 있 고 화면 에 떠 있 는 것 과 같 기 때문에 이것 은 dialog 에 만 적 용 됩 니 다.
android:windowContentOverlay:제목 표시 줄 의 그림자 부분 을 표시 하 는 스타일 로 그림 이나 색 을 사용 합 니 다.
android:windowNoTitle:제목 표시 줄 을 숨 길 지 여부 입 니 다.이것 이 바로 우리 위 에 표 시 된 제목 표시 줄 입 니 다.
양식 에 관 한 내용 이 매우 많 고 잡다 합 니 다.여기 에는'Andriod 에서 Style/Theme 원리 와 Activity 인터페이스 파일 선택 과정 에 대한 분석'을 참고 하여 양식 과 주제 에 관 한 내용 을 정리 할 수 있 는 기 회 를 드 리 겠 습 니 다.그때 다시 자세히 말씀 드 리 겠 습 니 다.여 기 는 본 편의 중점 이 아니 므 로 더 이상 자세히 말씀 하지 않 겠 습 니 다.
2.사용 스타일
방법 1:
여기 에는 두 가지 방법 으로 스타일 을 사용 하 는데 주로 구조 함 수 를 이용 합 니 다.우리 가 위 에서 말 한 대화 상자 의 두 가지 구조 함 수 를 기억 합 니 다.

public class CustomDialog extends Dialog { 
 Context mContext; 
 public CustomDialog(Context context) { 
  super(context); 
  mContext = context; 
 } 
 public CustomDialog(Context context, int theme) { 
  super(context, theme); 
  mContext = context; 
 } 
 ………… 
} 
두 번 째 는 우리 의 Theme 스타일 입 니 다.그래서 첫 번 째 스타일 을 사용 하 는 방법 은 구조 할 때 직접 스타일 을 전달 하 는 것 입 니 다.이렇게 사용 하면 우 리 는 대화 상 자 를 구성 할 때 이렇게 해 야 합 니 다."

public class MainActivity extends Activity { 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  setContentView(R.layout.activity_main); 
  Button btn = (Button)findViewById(R.id.btn_pop_dialog); 
  btn.setOnClickListener(new View.OnClickListener() { 
   @Override 
   public void onClick(View view) { 
    CustomDialog dialog = new CustomDialog(MainActivity.this,R.style.dialog); 
    dialog.show(); 
   } 
  }); 
 } 
} 
즉,사용자 정의 Dialog 인 스 턴 스 를 새로 만 들 때 두 번 째 매개 변 수 는 우리 가 정의 한 스타일 로 전 달 됩 니 다.
방법 2:
두 번 째 방법 은 바로 우리 가 구 조 를 할 때 다른 사람 이 스타일 을 전달 하지 못 하 게 하고 Context 만 들 어 오 게 하 는 것 이다.그러나 내부 에서 우 리 는 Super(context,theme)를 이용 하여 스타일 을 지정 한다.코드 는 다음 과 같다.

public class CustomDialog extends Dialog { 
 Context mContext; 
 public CustomDialog(Context context) { 
  super(context,R.style.dialog); 
  mContext = context; 
 } 
 ………… 
} 
이러한 상황 은 일반적으로 우리 가 코드 를 봉인 할 때 다른 사람 이 외부 에서 우리 의 스타일 을 바 꾸 지 못 하 게 할 때 사용 하 는 것 이다.
어떤 방법 을 사용 하든지 간 에 우 리 는 이미 나의 대화 상자 스타일 을 지정 했다.현재 의 효 과 는 다음 과 같다.
보 셨 습 니까?위의 제목 표시 줄 이 사 라 졌 습 니 다.다음은 매개 변수 전달 에 관 한 문 제 를 살 펴 보 겠 습 니 다.
3.매개 변수 전달
여기 에는 두 가지 문제 가 관련 되 어 있다.들 어가 고 들 어 오 는 것 이다.
들 어가 기:아래 에 두 개의 단추 가 있 습 니 다.사용자 가 첫 번 째 단 추 를 눌 렀 을 때 대화 상자 에"From btn 1"을 표시 합 니 다.사용자 가 두 번 째 단 추 를 누 르 면 대화 상자 에"From btn 2"를 표시 합 니 다.
전송:이 네 개의 그림 은 모두 클릭 할 수 있 습 니 다.사용자 가 모든 그림 을 클릭 하면 ID 를 전송 하고 우리 의 MainActivity 에 설정 할 수 있 습 니 다.
대화 상자 의 레이아웃 을 잘 이해 하기 위해 수평 레이아웃 을 수직 레이아웃 으로 바 꾸 었 습 니 다.그리고 MainActivey 밑 에 ImageView 를 추 가 했 습 니 다.

1.들 어가 기
대화 상자 에 파 라 메 터 를 전달 하 는 것 은 일반적으로 구조 함 수 를 이용 하여 이 루어 집 니 다.간단 합 니 다.즉,대화 상자 의 구조 함수 에 우리 가 전달 하고 자 하 는 파 라 메 터 를 추가 하 는 것 입 니 다.여기 서 우 리 는 어떤 BTN 에서 왔 는 지 표시 하 는 문자열 을 추가 로 전달 해 야 합 니 다.
그래서 대화 상자 의 구조 함수 가 이렇게 되 었 습 니 다.

public class CustomDialog extends Dialog{ 
 private Context mContext; 
 private String mStr; 
 public CustomDialog(Context context, String str, int theme) { 
  super(context, theme); 
  mContext = context; 
  mStr = str; 
 } 
 ………… 
}
사용 할 때 도 간단 합 니 다.

Button btn2 = (Button)findViewById(R.id.btn_pop_dialog_2); 
btn2.setOnClickListener(new View.OnClickListener() { 
 @Override 
 public void onClick(View view) { 
  CustomDialog dialog = new CustomDialog(MainActivity.this,"From btn 2",R.style.dialog); 
  dialog.show(); 
 } 
}); 
구조 함 수 를 직접 이용 하여 인삼 을 전달 하면 된다.
2.전해 진다
구조 함수 로 파 라 메 터 를 전달 하 는 것 은 모두 가 알 고 있 지만 사용자 의 조작 정 보 를 어떻게 전달 해 야 하 는 지 는 그리 간단 하지 않 습 니 다.여 기 는 리 셋 을 이용 하여 이 루어 져 야 합 니 다!
리 셋 함수 의 사용 은 주로 아래 의 절차 에 따른다.
대화 상자 에서:

public class CustomDialog extends Dialog { 
 //   interface          
 public interface ICustomDialogEventListener { 
  public void customDialogEvent(int valueYouWantToSendBackToTheActivity); 
 } 
 private ICustomDialogEventListener onCustomDialogEventListener; 
 //       ,         
 public CustomDialog(Context context, 
      ICustomDialogEventListener onCustomDialogEventListener) { 
  super(context); 
  this.onCustomDialogEventListener = onCustomDialogEventListener; 
 } 
 //           ,             
 @Override 
 public void onCreate(Bundle savedInstanceState) 
 { 
  Button btnOk = (Button) findViewById(R.id.customDialogButton); 
  btnOk.setOnClickListener( new Button.OnClickListener() 
  { 
   public void onClick(View v) { 
    onCustomDialogEventListener.customDialogEvent(valueYouWantToSendBackToTheActivity); 
    dismiss(); 
   } 
  }); 
 } 
} 
구조 대화 상자 에서:

final CustomDialog dialog = new CustomDialog(this, new ICustomDialogEventListener() { 
 public void customDialogEvent(int value) { 
  //                  
 } 
}); 
대체적으로 사용 절 차 는 바로 이렇다.다음은 우리 위의 효 과 를 리 셋 함 수 를 이용 하여 실현 한다.
우선 대화 상자 에 리 셋 함수(인터페이스)를 새로 만 들 고 대화 상자 의 구조 방법 에서 리 셋 함 수 를 전달 합 니 다.

public class CustomDialog extends Dialog implements View.OnClickListener { 
 //        ,           
 public interface ICustomDialogEventListener { 
  public void customDialogEvent(int id); 
 } 
 private ICustomDialogEventListener mCustomDialogEventListener; 
 private Context mContext; 
 private String mStr; 
 //         
 public CustomDialog(Context context, String str, ICustomDialogEventListener listener, int theme) { 
  super(context, theme); 
  mContext = context; 
  mStr = str; 
  mCustomDialogEventListener = listener; 
 } 
 ………… 
} 
그리고 OnCreate()함수 에서 ImageView 의 클릭 이 벤트 를 설정 합 니 다.저 희 는 CustomDialog 류 를 View 에 계승 합 니 다.OnClickListener 인 터 페 이 스 를 통 해 클릭 이 벤트 를 통일 적 으로 처리 합 니 다.

private void bindImageClickEvent(View layout){ 
 ImageView img1 = (ImageView)layout.findViewById(R.id.dialog_image1); 
 ImageView img2 = (ImageView)layout.findViewById(R.id.dialog_image2); 
 ImageView img3 = (ImageView)layout.findViewById(R.id.dialog_image3); 
 ImageView img4 = (ImageView)layout.findViewById(R.id.dialog_image4); 
 img1.setOnClickListener(this); 
 img2.setOnClickListener(this); 
 img3.setOnClickListener(this); 
 img4.setOnClickListener(this); 
} 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
 super.onCreate(savedInstanceState); 
 LayoutInflater inflater = (LayoutInflater) mContext 
   .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
 View layout = inflater.inflate(R.layout.custom_dialog, null); 
 TextView tv = (TextView)layout.findViewById(R.id.dialog_text); 
 tv.setText(mStr); 
 bindImageClickEvent(layout);//  ImageView     
 this.setContentView(layout); 
} 
OnCreate()에서 먼저 들 어 오 는 String 문자열 을 대화 상자 의 TextView 에 설정 합 니 다.그리고 각 ImageView 의 클릭 이 벤트 를 연결 합 니 다.
그리고 OnClick 에서 의 처리:
주로 사용자 가 현재 클릭 한 ImageView 의 ID 에 따라 이 ImageView 에 사 용 된 그림 의 DrawableID 를 MainActivity 에 되 돌려 줍 니 다.코드 는 다음 과 같 습 니 다.

public void onClick(View view) { 
 int id = view.getId(); 
 int drawableID = -1; 
 switch (id){ 
  case R.id.dialog_image1: 
   drawableID = R.drawable.animal1; 
   break; 
  case R.id.dialog_image2: 
   drawableID = R.drawable.animal2; 
   break; 
  case R.id.dialog_image3: 
   drawableID = R.drawable.animal3; 
   break; 
  case R.id.dialog_image4: 
   drawableID = R.drawable.animal4; 
   break; 
 } 
 if (drawableID != -1) { 
  mCustomDialogEventListener.customDialogEvent(drawableID); 
 } 
 dismiss(); 
} 
이렇게 해서 대화 상자 의 구조 과정 을 끝 냈 습 니 다.완전한 대화 상자 코드 는 다음 과 같 습 니 다.

public class CustomDialog extends Dialog implements View.OnClickListener{ 
 //        ,           
 public interface ICustomDialogEventListener { 
  public void customDialogEvent(int id); 
 } 
 private ICustomDialogEventListener mCustomDialogEventListener; 
 private Context mContext; 
 private String mStr; 
 public CustomDialog(Context context) { 
  super(context); 
  mContext = context; 
 } 
 public CustomDialog(Context context, String str,ICustomDialogEventListener listener,int theme) { 
  super(context, theme); 
  mContext = context; 
  mStr = str; 
  mCustomDialogEventListener = listener; 
 } 
 private void bindImageClickEvent(View layout){ 
  ImageView img1 = (ImageView)layout.findViewById(R.id.dialog_image1); 
  ImageView img2 = (ImageView)layout.findViewById(R.id.dialog_image2); 
  ImageView img3 = (ImageView)layout.findViewById(R.id.dialog_image3); 
  ImageView img4 = (ImageView)layout.findViewById(R.id.dialog_image4); 
  img1.setOnClickListener(this); 
  img2.setOnClickListener(this); 
  img3.setOnClickListener(this); 
  img4.setOnClickListener(this); 
 } 
 @Override 
 protected void onCreate(Bundle savedInstanceState) { 
  super.onCreate(savedInstanceState); 
  LayoutInflater inflater = (LayoutInflater) mContext 
    .getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
  View layout = inflater.inflate(R.layout.custom_dialog, null); 
  TextView tv = (TextView)layout.findViewById(R.id.dialog_text); 
  tv.setText(mStr); 
  bindImageClickEvent(layout); 
  this.setContentView(layout); 
 } 
 @Override 
 public void onClick(View view) { 
  int id = view.getId(); 
  int drawableID = -1; 
  switch (id){ 
   case R.id.dialog_image1: 
    drawableID = R.drawable.animal1; 
    break; 
   case R.id.dialog_image2: 
    drawableID = R.drawable.animal2; 
    break; 
   case R.id.dialog_image3: 
    drawableID = R.drawable.animal3; 
    break; 
   case R.id.dialog_image4: 
    drawableID = R.drawable.animal4; 
    break; 
  } 
  if (drawableID != -1) { 
   mCustomDialogEventListener.customDialogEvent(drawableID); 
  } 
  dismiss(); 
 } 
} 
다음은 구조 대화 상자 의 과정 입 니 다.
MainAcitivity 에서 단 추 를 누 르 면 new ICustomDialogEventListener 인 스 턴 스 가 전 달 된 값 을 받 습 니 다.

Button btn = (Button)findViewById(R.id.btn_pop_dialog_1); 
btn.setOnClickListener(new View.OnClickListener() { 
 @Override 
 public void onClick(View view) { 
  CustomDialog dialog = new CustomDialog(MainActivity.this,"From btn 1",new CustomDialog.ICustomDialogEventListener() { 
   @Override 
   public void customDialogEvent(int id) { 
    ImageView imageView = (ImageView)findViewById(R.id.main_image); 
    imageView.setImageDrawable(getResources().getDrawable(id)); 
   } 
  },R.style.dialog); 
  dialog.show(); 
 } 
}); 
우리 가 보 내 온 DrawableID 를 받 았 을 때 gc 홈 페이지 이미지 VIEW 에 표시 하도록 설정 하면 위의 기능 이 완 료 됩 니 다.
자,본 고 는 여기까지 입 니 다.대화 상자 에 관 한 동 동 은 기본적으로 다 말 했 습 니 다.보통 우리 가 대화 상 자 를 사용자 정의 하 는 시간 이 비교적 많 기 때문에 여기 서 조금 더 말 했 습 니 다.

좋은 웹페이지 즐겨찾기