반응형
블로그 이미지
개발자로서 현장에서 일하면서 새로 접하는 기술들이나 알게된 정보 등을 정리하기 위한 블로그입니다. 운 좋게 미국에서 큰 회사들의 프로젝트에서 컬설턴트로 일하고 있어서 새로운 기술들을 접할 기회가 많이 있습니다. 미국의 IT 프로젝트에서 사용되는 툴들에 대해 많은 분들과 정보를 공유하고 싶습니다.
솔웅

최근에 받은 트랙백

글 보관함


그럼 구체적으로 sliding 되는 화면들은 어떤 구성을 갖게 될지 PersonPage.java를 분석하면서 공부해 보도록 하겠습니다.

일단 화면 구성을 할 layout xml 을 보도록 하죠.
슬라이딩으로 넘어갈 화면들은 여기서 정한 Layout 을 사용할 겁니다.





person_page.xml



<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
    <TextView
        android:id="@+id/nameText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30dp"
        />
    <Button
        android:id="@+id/callButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="20dp"
        android:text="전화걸기"
        android:focusable="false"
        />
    <ImageView
        android:id="@+id/iconImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />
</LinearLayout>



일단 전체 구조는 LinearLayout 으로 잡아놨고 그 안에 TextView, Button, ImageView를 배치 했습니다.

그러면 이제 PersonPage.java를 보겠습니다.



public class PersonPage extends LinearLayout {
    Context mContext;

    TextView nameText;
    Button callButton;
    ImageView iconImage;

    public static final int CALL_NUMBER = 1001;

    public PersonPage(Context context) {
        super(context);
        init(context);
    }

    public PersonPage(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);
    }

    private void init(Context context) {
        mContext = context;

        // inflate XML layout
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
        inflater.inflate(R.layout.person_page, this, true);

        iconImage = (ImageView) findViewById(R.id.iconImage);
        nameText = (TextView) findViewById(R.id.nameText);
        callButton = (Button) findViewById(R.id.callButton);
        callButton.setOnClickListener(new OnClickListener() {
            public void onClick(View v) {
                String callNumber = (String) callButton.getTag();
                Toast.makeText(mContext, "전화번호 : " + callNumber, Toast.LENGTH_LONG).show();
            }
        });
    }
    public void setImage(int resId) {
        iconImage.setImageResource(resId);
    }
    public void setCallNumber(String number) {
        callButton.setTag(number);
    }
    public String getNameText() {
        return nameText.getText().toString();
    }
    public void setNameText(String nameStr) {
        nameText.setText(nameStr);
    }
}



먼저 선언된 인스턴스들을 보면 Context, TextView, Button, ImageView 이런 것들이 있네요.
Context는 당연한거고 나머지는 Layout xml에서 선언된 view들인데요. 이걸 불러내서 이런 저런 처리를 하려고 하나 봅니다.
그 다음에 CALL_NUMBER라는 int 형이 final 로 1001이란 값을 받았네요.
이건 왜 이런지 소스를 보면서 알아가 보도록 하겠습니다.

일단 생성자인 PersonPage() 메소드에서는 init()메소드를 call 하고 있습니다.
그러니까 가장 먼저 init() 메소드가 실행이 될 겁니다.

init() 메소드에서는 다시 inflater 가 나오네요. 이것은 xml 문서의 리소스들을 받아 객체로 만들어 줘서 control할 수 있도록 만들어 주는 놈 입니다.
inflater 에 person_page.xml 을 세팅했습니다.

그러면 이제 person_page.xml 파일 안에 있는 리소스들에 대한 객체를 만들 수가 있는데요.
처음에 선언했던 객체를 사용해서 iconImage, nameText, callButton 에 대한 객체를 만들었습니다.
그리고 그 다음에는 callButton 에 onClickListener를 세팅해서 이 버튼이 눌려지면 전화면호가 화면에 표시되도록 (Toast) 만들어 놨군요.

그 다음에 나오는 메소드들은 setter와 getter 메소드들 입니다.
바로 MainActivity 에서 배열에 있는 이름, 전화번호, 이미지 파일들을 이 setter들을 사용해서 세팅을 했었죠?

PersonPage.java 에서는 MainActivity.java에서 받은 내용을 가지고 person_page.xml에 정의된 Layout 에 그 내용들을 넣고 그 view들에게 리스너등을 넣어서 어떤 이벤트 등에 반응 할 수 있도록 하는 클래스 입니다.
MainActivity 는 ViewPager를 사용할 수 있도록 세팅하고 각 페이지에 들어갈 내용들을 PersonPage에 보내서 페이지를 구성할 수 있도록 하고 있구요.


여기까지 ViewPager에 대해 알아 봤습니다.



반응형

Comment