Android 개발 의 사용자 정의 컨트롤 사용법 상세 설명

이 실례 는 안 드 로 이 드 개발 의 사용자 정의 컨트롤 사용법 을 설명 한다.여러분 께 참고 하도록 공유 하 겠 습 니 다.구체 적 으로 는 다음 과 같 습 니 다.
오늘 은 조합 컨트롤 의 사용 을 공유 합 니 다.안 드 로 이 드 사용자 정의 컨트롤 이 수 요 를 만족 시 키 지 못 할 때 가 많 습 니 다.어떻게 하 시 겠 습 니까?여러 가지 방법 으로 스스로 그 릴 수 있 습 니 다.기본 컨트롤 을 계승 하여 일부 절 차 를 다시 쓸 수 있 습 니 다.물론 컨트롤 을 새로운 컨트롤 로 조합 할 수도 있 습 니 다.이것 도 가장 편리 한 방법 입 니 다.오늘 은 조합 컨트롤 을 어떻게 사용 하 는 지 두 가지 인 스 턴 스 를 통 해 소개 하 겠 습 니 다.
그림 과 텍스트 가 있 는 첫 번 째 단 추 를 실현 합 니 다.그림 과 같 습 니 다.

전체 과정 은 네 걸음 으로 나 눌 수 있다.첫 번 째 단 계 는 layot 를 정의 하여 단추 내부 의 레이아웃 을 실현 합 니 다.코드 는 다음 과 같 습 니 다:
custom_button.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=http://schemas.android.com/apk/res/android"
  android:orientation="horizontal"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  >
 <ImageView
 android:id="@+id/iv"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_gravity="center_vertical"
   android:paddingLeft="10.0dip"
   android:paddingTop="10.0dip"
   android:paddingBottom="10.0dip"
   />
 <TextView
 android:id="@+id/tv"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textColor="#ffffff"
   android:layout_marginLeft="8dip"
   android:layout_gravity="center_vertical"
   android:paddingLeft="5.0dip"
   android:paddingTop="10.0dip"
   android:paddingBottom="10.0dip"
   android:paddingRight="10.0dip"
   android:textSize="18.0sp"
   />
</LinearLayout>

이 xml 는 왼쪽 그림 오른쪽 글자 의 구 조 를 실현 합 니 다.그 다음 에 LinearLayout 를 계승 하여 방금 구 조 를 가 져 오고 필요 한 방법 을 설정 하여 코드 에서 이 사용자 정의 컨트롤 내용 의 표 시 를 제어 할 수 있 도록 합 니 다.코드 는 다음 과 같 습 니 다:
CustomButton.java

package com.szy.customview;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
public class CustomButton extends LinearLayout
{
 private ImageView iv;
 private TextView tv;
 public CustomButton(Context context)
 {
 this(context, null);
 }
 public CustomButton(Context context, AttributeSet attrs)
 {
 super(context, attrs);
 //     
 LayoutInflater.from(context).inflate(R.layout.custom_button, this, true);
 iv = (ImageView) findViewById(R.id.iv);
 tv = (TextView) findViewById(R.id.tv);
 }
 /**
 *       
 */
 public void setImageResource(int resId)
 {
 iv.setImageResource(resId);
 }
 /**
 *        
 */
 public void setTextViewText(String text)
 {
 tv.setText(text);
 }
}

세 번 째 단 계 는 이 사용자 정의 컨트롤 을 사용 해 야 하 는 layot 에 이 컨트롤 을 추가 하고 xml 에 만 추가 하면 됩 니 다.방법 은 다음 과 같다.
main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical"
 >
 <com.szy.customview.CustomButton
   android:id="@+id/bt_confirm"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:background="@drawable/button_bg"
   />
 <com.szy.customview.CustomButton
   android:id="@+id/bt_cancel"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:background="@drawable/button_bg"
  />
</LinearLayout>

주의해 야 할 것 은 컨트롤 탭 은 완전한 클래스 이름 을 사용 하면 됩 니 다.버튼 에 클릭 효 과 를 주기 위해 서 는 selector 배경 을 줘 야 합 니 다.여 기 는 말 하지 않 겠 습 니 다.
마지막 단 계 는 activity 에서 이 컨트롤 의 내용 을 설정 하 는 것 입 니 다.물론 xml 에서 도 설정 할 수 있 지만 하나만 설정 할 수 있 습 니 다.이러한 컨트롤 을 두 번 사용 해 야 하고 내용 을 동시에 표시 하지 않 으 면 안 됩 니 다.activity 에서 설정 하 는 것 도 매우 간단 합 니 다.저 희 는 Custom Button 류 에 해당 하 는 방법 을 적 었 습 니 다.간단하게 호출 하면 됩 니 다.코드 는 다음 과 같 습 니 다:

package com.szy.customview;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
public class MainActivity extends Activity
{
 private CustomButton btnConfirm;
 private CustomButton btnCancel;
 @Override
 public void onCreate(Bundle savedInstanceState)
 {
 super.onCreate(savedInstanceState);
 setContentView(R.layout.main);
 btnConfirm = (CustomButton) findViewById(R.id.bt_confirm);
 btnCancel = (CustomButton) findViewById(R.id.bt_cancel);
 btnConfirm.setTextViewText("  ");
 btnConfirm.setImageResource(R.drawable.confirm);
 btnCancel.setTextViewText("  ");
 btnCancel.setImageResource(R.drawable.cancel);
 btnConfirm.setOnClickListener(new OnClickListener()
 {
  @Override
  public void onClick(View v)
  {
  //            
  }
 });
 }
}

이렇게 하면 텍스트 와 그림 이 있 는 조합 버튼 컨트롤 이 완 료 됩 니 다.이렇게 빗 으 면 사용 이 매우 간단 하 다.조합 컨트롤 이 할 수 있 는 일이 매우 많 습 니 다.주로 상례 와 같은 CustomButton 류 에 사용 할 방법 을 쓰 면 됩 니 다.
삭제 단 추 를 가 진 EidtText 조합 컨트롤 을 다시 보 세 요.즉,사용자 가 입력 하면 삭제 버튼 이 나타 나 고 클릭 하면 사용자 의 입력 을 취소 할 수 있다.
정의 방법 은 상례 와 같다.먼저 사용자 정의 컨트롤 의 레이아웃 을 작성 합 니 다:
custom_editview.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  >
 <EditText
   android:id="@+id/et"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:singleLine="true"
   />
 <ImageButton
   android:id="@+id/ib"
   android:visibility="gone"
   android:src="@drawable/cancel"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:background="#00000000"
   android:layout_alignRight="@+id/et" />
</RelativeLayout>

입력 상자 오른쪽 에 단추 효과 가 있 습 니 다.단 추 를 숨 기 는 것 에 주의 하 십시오.그리고 사용자 입력 기능 을 삭제 하기 위해 Custom EditView 클래스 를 작성 합 니 다.입력 상자 의 문자 변 화 를 감청 하기 위해 TextWatch 라 는 인 터 페 이 스 를 사 용 했 습 니 다.사용 도 간단 하 니 그의 세 가지 방법 을 실현 하면 된다.코드 보기:
CustomEditView.java

package com.szy.customview;
import android.content.Context;
import android.text.Editable;
import android.text.TextWatcher;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.EditText;
import android.widget.ImageButton;
import android.widget.LinearLayout;
public class CustomEditView extends LinearLayout implements EdtInterface
{
 ImageButton ib;
 EditText et;
 public CustomEditView(Context context)
 {
 super(context);
 }
 public CustomEditView(Context context, AttributeSet attrs)
 {
 super(context, attrs);
 LayoutInflater.from(context).inflate(R.layout.custom_editview, this, true);
 init();
 }
 private void init()
 {
 ib = (ImageButton) findViewById(R.id.ib);
 et = (EditText) findViewById(R.id.et);
 et.addTextChangedListener(tw);//                   
 //         
 ib.setOnClickListener(new OnClickListener()
 {
  @Override
  public void onClick(View v)
  {
  hideBtn();//     
  et.setText("");//          
  }
 });
 }
 //          ,        
 TextWatcher tw = new TextWatcher()
 {
 @Override
 public void onTextChanged(CharSequence s, int start, int before, int count)
 {
  // TODO Auto-generated method stub
 }
 @Override
 public void beforeTextChanged(CharSequence s, int start, int count, int after)
 {
  // TODO Auto-generated method stub
 }
 //         
 @Override
 public void afterTextChanged(Editable s)
 {
  if (s.length() == 0)
  {
  hideBtn();//     
  } else
  {
  showBtn();//     
  }
 }
 };
 @Override
 public void hideBtn()
 {
 //        
 if (ib.isShown())
  ib.setVisibility(View.GONE);
 }
 @Override
 public void showBtn()
 {
 //       
 if (!ib.isShown())
 {
  ib.setVisibility(View.VISIBLE);
 }
 }
}
interface EdtInterface
{
 public void hideBtn();
 public void showBtn();
}

TextWatch 인터페이스의 after TextChanged 방법 에서 텍스트 를 판단 하고 길이 가 0 이면 단 추 를 숨 깁 니 다.그렇지 않 으 면 단 추 를 표시 합 니 다.
또한 ImageButton(즉 그 포크)의 클릭 이 벤트 를 실현 하고 입력 상자 의 내용 을 삭제 하 며 단 추 를 숨 깁 니 다.
뒤의 두 단계 의 실현 은 바로 실제 구조 에 가입 하 는 것 이다.
main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent"
 android:orientation="vertical"
 >
 <com.szy.customview.CustomEditView
 android:layout_width="fill_parent"
   android:layout_height="wrap_content"
  />
</LinearLayout>

마지막 으로 그림 과 같이 효과 보이 기:

더 많은 안 드 로 이 드 관련 내용 에 관심 이 있 는 독자 들 은 본 사이트 의 주 제 를 볼 수 있다.
본 고 에서 말 한 것 이 여러분 의 안 드 로 이 드 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.

좋은 웹페이지 즐겨찾기