ViewPagerIndictor 프레임 워 크 사용 (첫 번 째 부분)

이틀 동안 뷰 페이지 인디케이터 를 철저히 해 봤 는데 인터넷 에 있 는 블 로 거들 의 블 로그 가 좋 습 니 다.하지만 프레임 하 나 를 사용 하면 아무것도 남지 않 는 다 고 생각 합 니 다.다음 에 또 공부 하 러 올 거 야.이번 에는 상세 한 블 로 그 를 기록 합 니 다.후 용 에 대비 하 다.
우수한 블 로그:http://blog.csdn.net/xiaanming/article/details/10766053
           http://www.linuxidc.com/Linux/2015-02/113545.htm
1.   다운로드 하 다.
다운로드 주소:https://github.com/JakeWharton/ViewPagerIndicator
다운로드 후 두 개의 프로젝트 가 있 습 니 다.
Library 는 제3자 라 이브 러 리 이 고 Sample 은 간단 한 프 리 젠 테 이 션 프로젝트 입 니 다.다양한 스타일 의 효 과 를 볼 수 있 습 니 다.가 져 올 때 작업 공간 으로 복사 하 는 것 이 좋 습 니 다.
2.   쓰다
sample 을 실행 한 후 원 하 는 스타일 을 선택 하 십시오.나 는 이 스타일 들 이 세 가지 로 나 눌 수 있다 고 생각한다. 그것 이 바로 간단 한 지시, 문자 tab 알림, 그림 알림 이다.하나하나 기록 하 겠 습 니 다.
스타일 1) 간단 한 팁
 이런 스타일 은 가장 간단하게 원점 을 사용 하고 짧 은 선 으로 미 끄 러 지 는 유형 을 알려 준다.같다:
1.
2.
3
4.
이 힌트 들 은 기본적으로 가장 간단 한 기하학 적 힌트 로 미끄럼 페이지 수 를 제시 하 는 것 이다.환영 인터페이스 나 app 으로 보 여 주 는 인터페이스 를 매우 사용 합 니 다.
사용 할 때 중점 은 각 간 의 호출 관 계 를 정리 하 는 것 이다.
첫 번 째 원점 힌트 를 예 로 들 면:
1 > 레이아웃
<LinearLayoutxmlns: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"
    android:orientation="vertical"
    tools:context=".MainActivity"xmlns:app="http://schemas.android.com/apk/res/com.example.testpagerview">
   
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        />
   
    <com.viewpagerindicator.CirclePageIndicator
        android:id="@+id/indicator"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:radius="10dp"
        app:pageColor="@android:color/darker_gray"
        app:fillColor="@android:color/holo_blue_light"
        app:strokeColor="#FFAA0000"
        app:strokeWidth="4dp"
        
        />
 
</LinearLayout>

기본적으로 이러한 상하 레이아웃 입 니 다. 위 에는 v4 패키지 의 viewPager 이 고 아래 에는 사용 할 Indicator 입 니 다. 원 하 는 스타일 을 선택 하 십시오.알림 에 대한 세부 스타일 은 사용자 정의 속성 에서 수정 할 수 있 습 니 다.
2) 관련 유형:
관련 클래스 는 다음 과 같 습 니 다. 관련 Activity (Fragment Activity 를 계승 해 야 합 니 다), Circle Fragment Pager Adapter (Fragment Pager Adapter 를 계승 해 야 합 니 다), Circle Fragment (Fragment - V4 가방 을 계승 해 야 합 니 다)
사용 방법:
1.   CircleFragment 정의
Fragment 에 서 는 일반적인 것 으로 정의 (onCreate View 재 작성) 하면 되 고 복잡 할 수도 있 습 니 다.
publicclassTestFragmentextends Fragment{
   //  Fragment    
   privateintcontent;
   //           
   privatestaticfinal StringCONTENT_KEY ="Content:key";
  
   //        TestFragment
   publicstatic FragmentnewInstance(int resId){
      TestFragment fragment = newTestFragment();
      fragment.content = resId;
      return fragment;
   }
  
   // oncreate        content
   @Override
   publicvoidonCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      if(savedInstanceState!=null && savedInstanceState.containsKey(CONTENT_KEY)){
         content =savedInstanceState.getInt(CONTENT_KEY);
      }
   }
  
   //    fragment   
   @Override
   public ViewonCreateView(LayoutInflater inflater, ViewGroup container,
         Bundle savedInstanceState) {
      ImageView view = newImageView(getActivity());
      view.setLayoutParams(newLayoutParams(LayoutParams.MATCH_PARENT,
            LayoutParams.MATCH_PARENT));
      view.setBackgroundResource(content);
     
      return view;
   }
   //     
   @Override
   publicvoidonSaveInstanceState(Bundle outState) {
      super.onSaveInstanceState(outState);
      outState.putInt(CONTENT_KEY,content);
   }
 
}

2. CircleFragmentPagerAdapter 정의:
힌트 에 따라 잘못 을 고치 면 됩 니 다. 다시 쓰 는 방법 도 간단 합 니 다.
publicclassTestFragmentPagerAdapterextendsFragmentPagerAdapter{
 
   publicTestFragmentPagerAdapter(FragmentManager fm) {
      super(fm);
   }
   /**
    *              index position      fragment
    */
   @Override
   public Fragment getItem(int position){
      returnTestFragment.newInstance(Const.WELCOME_PAGER_IMAGES[position]);
   }
 
   /**
    *                  fragment
    */
   @Override
   publicintgetCount() {
      return Const.WELCOME_PAGER_IMAGES.length;
   }
 
}
 

3. Activity 에서 찾 는 두 개의 공간 ViewPager 와 Indicator 는 다음 과 같은 동작 을 합 니 다.
      ViewPager.setAdapter(CircleFragmentPagerAdapter)
      Indicator.setViewPager(viewPager);
관련 관계:
Viewpager->FragmentPagerAdpater->Fragment
Indicator->viewPager
다음 과 같다.
publicclassMainActivityextends FragmentActivity {
  
   private ViewPagerviewPager;
   private CirclePageIndicatorindicator;
   private FragmentPagerAdapteradapter;
 
    @Override
    protectedvoidonCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
       
        adapter =newTestFragmentPagerAdapter(getSupportFragmentManager());
        viewPager =(ViewPager) findViewById(R.id.viewpager);
        viewPager.setAdapter(adapter);
       
        indicator =(CirclePageIndicator) findViewById(R.id.indicator);
        indicator.setViewPager(viewPager);
       
    }
 
 
    @Override
    publicbooleanonCreateOptionsMenu(Menu menu) {
        // Inflate themenu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        returntrue;
    }
   
}
 

마지막 효 과 는 다음 과 같다.
이런 일 은 모든 Indicator 가 사용 하 는 기본 방식 입 니 다.다른 두 가지 방식 도 이 위 에 추 가 된 것 이다.반드시 스스로 시험 해 봐 야 한다.

좋은 웹페이지 즐겨찾기