Android UI 디자인 및 개발 의 ViewPager 소개 및 간단 한 구현 안내 인터페이스

안 드 로 이 드 개발 을 합 친 지 거의 1 년 이 넘 었 습 니 다.개발 과정 에서 느 낀 점 을 적어 서 여러분 과 함께 교류 하고 공유 하 며 발전 하려 고 했 습 니 다.처음에 써 도 어떻게 손 을 써 야 할 지 곰 곰 이 생각해 보 았 습 니 다.처음에 썼 으 니 소프트웨어 가 가장 직관 적 인 느낌 을 주 었 습 니 다.UI 디자인 부터 쓰 세 요.순서에 따라 점진 적 이 고 흥미진진 합 니 다.블 로 거들 은 이곳 에서 여러분 과 함께 공부 하고 있 습 니 다.많은 응원 과 말 을 하지 않 고 UI 디자인 의 첫 편 을 설명 하 겠 습 니 다.           
안내 인터페이스의 효 과 를 어떻게 실현 하 는 지 설명 하기 전에 ViewPager 류 의 사용 과 설명 을 상세 하 게 소개 하고 싶 습 니 다.이것 은 개발 안내 인터페이스 에서 가장 중요 한 유형 이기 때문에 하나 도 없습니다.
1.ViewPager 가 실현 하 는 효과 그림
   
2.ViewPager 가 실현 하 는 기능
위의 효과 도 를 보면 이런 종류 가 무엇 에 쓰 이 는 지 알 수 있 을 것 입 니 다.ViewPager 류 는 다 중 인터페이스 전환 의 새로운 효 과 를 제공 합 니 다.
새로운 효 과 는 다음 과 같은 특징 이 있 습 니 다.
<1>현재 한 그룹의 인터페이스 중 하 나 를 표시 합 니 다.
<2>사용자 가 좌우 슬라이딩 인 터 페 이 스 를 통과 할 때 현재 화면 은 현재 인터페이스 와 다음 인터페이스의 일부분 을 표시 합 니 다.
<3>미끄럼 이 끝 난 후,인터페이스 가 현재 선택 한 인터페이스 로 자동 으로 이동 합 니 다. 
3.ViewPager 상세 설명
이것 은 구 글 이 우리 에 게 제공 한 저 버 전의 안 드 로 이 드 장 치 를 호 환 하 는 소프트웨어 패키지 로 안 드 로 이 드 3.0 이상 에서 만 사용 할 수 있 는 api 를 포함 하고 있다.그리고 viewpager 는 그 중의 하나 입 니 다.우 리 는 가장 간단 한 네 비게 이 션 부터 페이지 메뉴 까지 많은 일 을 할 수 있 습 니 다.그것 을 어떻게 사용 합 니까?LisstView 와 비슷 합 니 다.우리 도 어댑터 가 필요 합 니 다.그 가 바로 Pager Adapter 입 니 다.API 그림 보기:         

4.ViewPager 의 사용
ViewPager 류 의 기능 과 소 개 를 알 았 으 니 이 종 류 는 어떻게 사용 할 것 인가?여기 서 우 리 는 세 단계 로 나 누 어 그것 을 사용한다.
1.레이아웃 파일 에 추가 합 니 다.

<android.support.v4.view.ViewPager  //                   ,     xml    ,         。  
 android:id="@+id/viewpager"  
 android:layout_width="wrap_content"  
 android:layout_height="wrap_content"  
 android:layout_gravity="center" >  

2.표시 할 페이지 카드 를 불 러 옵 니 다.

LayoutInflater lf = getLayoutInflater().from(this);  
    view1 = lf.inflate(R.layout.layout1, null);  
    view2 = lf.inflate(R.layout.layout2, null);  
    view3 = lf.inflate(R.layout.layout3, null);  
  
    viewList = new ArrayList<View>();//        View        
    viewList.add(view1);  
    viewList.add(view2);  
    viewList.add(view3);  

3.Activity 에서 ViewPager 구성 요 소 를 예화 하고 Adapter(PagerAdapter,방법 은 ListView 와 같은 것)를 설정 합 니 다.여기 서 는 일반적으로 PagerAdapter 를 다시 써 야 합 니 다.

PagerAdapter pagerAdapter = new PagerAdapter() {  
  
      @Override  
      public boolean isViewFromObject(View arg0, Object arg1) {  
  
        return arg0 == arg1;  
      }  
  
      @Override  
      public int getCount() {  
  
        return viewList.size();  
      }  
  
      @Override  
      public void destroyItem(ViewGroup container, int position,  
          Object object) {  
        container.removeView(viewList.get(position));  
  
      }  
  
      @Override  
      public int getItemPosition(Object object) {  
  
        return super.getItemPosition(object);  
      }  
  
      @Override  
      public CharSequence getPageTitle(int position) {  
  
        return titleList.get(position);  
      }  
  
      @Override  
      public Object instantiateItem(ViewGroup container, int position) {  
        container.addView(viewList.get(position));  
        weibo_button=(Button) findViewById(R.id.button1);  
        weibo_button.setOnClickListener(new OnClickListener() {  
            
          public void onClick(View v) {  
            intent=new Intent(ViewPagerDemo.this,WeiBoActivity.class);  
            startActivity(intent);  
          }  
        });  
        return viewList.get(position);  
      }  
  
    };  
    viewPager.setAdapter(pagerAdapter); 

이것 은 Pager Adapter 를 다시 쓰 는 방법 입 니 다.우 리 는 이렇게 할 수 있 습 니 다.

public class MyViewPagerAdapter extends PagerAdapter{  
    private List<View> mListViews;  
      
    public MyViewPagerAdapter(List<View> mListViews) {  
      this.mListViews = mListViews;//    ，        ，      。   
    }  
  
    @Override  
    public void destroyItem(ViewGroup container, int position, Object object)  {    
      container.removeView(mListViews.get(position));//       
    }   
  
    @Override  
    public Object instantiateItem(ViewGroup container, int position) { //                 
       container.addView(mListViews.get(position), 0);//       
       return mListViews.get(position);  
    }  
  
    @Override  
    public int getCount() {       
      return mListViews.size();//          
    }  
      
    @Override  
    public boolean isViewFromObject(View arg0, Object arg1) {        
      return arg0==arg1;//          
    }  
  }  

위의 그림 에서 볼 수 있 듯 이 ViewPager 의 어댑터 는 Pager Adapter 입 니 다.기본 클래스 에서 페이지 ViewPager 내 부 를 채 우 는 어댑터 입 니 다.Fragment Pager Adapter 나 Fragment StatePager Adapter 와 같은 구체 적 인 실현 을 사용 하고 싶 을 수도 있 습 니 다.여기 서 설명 이 필요 하 다.사실 ViewPager 는 Fragment 와 함께 사용 해 야 한다.적어도 구 글 은 공식 적 으로 이렇게 생각 하지만 3.0 에서 우 리 는 이렇게 할 필요 가 없다.PagerAdapter 를 실현 하려 면 다음 과 같은 방법 을 덮어 써 야 합 니 다.

instantiateItem(ViewGroup, int)
destroyItem(ViewGroup, int, Object)
getCount()
isViewFromObject(View, Object)

이 한 편 은 ViewPager 를 설명 한 후에 여러분 도 그것 에 대해 초보적인 인식 을 가 져 야 한다 고 믿 습 니 다.그러면 뒤의 몇 편의 글 에서 우 리 는 이런 유형 을 중심 으로 계속 전개 할 것 입 니 다.여러분 들 이 UI 의 디자인 과 개발 에 대해 더욱 깊이 이해 하 는 데 도움 이 되 기 를 바 랍 니 다.
이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.