天天看點

Android:使用ViewPager實作左右滑動切換圖檔(圖上有點點)

在以下執行個體的基礎上加上點點

Android:使用ViewPager實作左右滑動切換圖檔 (簡單版)

效果預覽:

Android:使用ViewPager實作左右滑動切換圖檔(圖上有點點)
因為要把點點放圖檔上,是以修改布局為相對布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <!-- 切換卡 -->
    <android.support.v4.view.ViewPager
         android:id="@+id/viewPager"  
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
        >  
    </android.support.v4.view.ViewPager>  
    
    <!-- 點點 -->   
        <LinearLayout  
        android:id="@+id/viewGroup"  
        android:layout_width="fill_parent"  
        android:layout_height="wrap_content"  
        android:layout_alignParentBottom="true"  
        android:layout_marginBottom="40dp"  
        android:gravity="center_horizontal"  
        android:orientation="horizontal" >         
    </LinearLayout>  
</RelativeLayout>      

程式新增:

private ImageView imageView; 
private ImageView[] imageViews; 
//包裹點點的LinearLayout
private ViewGroup group;      
group = (ViewGroup)findViewById(R.id.viewGroup); 
        
        //有多少張圖就有多少個點點
        imageViews = new ImageView[pageview.size()];
        for(int i =0;i<pageview.size();i++){
            imageView = new ImageView(MainActivity.this);
            imageView.setLayoutParams(new LayoutParams(20,20));
            imageView.setPadding(20, 0, 20, 0); 
            imageViews[i] = imageView;   
            
            //預設第一張圖顯示為選中狀态
            if (i == 0) {  
                imageViews[i].setBackgroundResource(R.drawable.page_indicator_focused);  
            } else {  
                imageViews[i].setBackgroundResource(R.drawable.page_indicator_unfocused);  
            }  
            
            group.addView(imageViews[i]);  
        }
        
        
        
        
        //pageView監聽器
        class GuidePageChangeListener implements OnPageChangeListener{

            @Override
            public void onPageScrollStateChanged(int arg0) {
                // TODO Auto-generated method stub
                
            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
                // TODO Auto-generated method stub
                
            }

            @Override
            //如果切換了,就把目前的點點設定為選中背景,其他設定未選中背景
            public void onPageSelected(int arg0) {
                // TODO Auto-generated method stub
                for(int i=0;i<imageViews.length;i++){
                    imageViews[arg0].setBackgroundResource(R.drawable.page_indicator_focused);
                     if (arg0 != i) {  
                            imageViews[i].setBackgroundResource(R.drawable.page_indicator_unfocused);  
                        }  
                }
                
            }
            
        }
        
        //綁定監聽事件
        viewPager.setOnPageChangeListener(new GuidePageChangeListener());      

>>>>>>>>>>>>>>>>執行個體下載下傳

Android:使用ViewPager實作左右滑動切換圖檔(圖上有點點)