彷微信主界面頁面滑動時指示顏色條平滑滑動

本文轉載自查看原文 2014-02-22 02:03 3216 Android - 應用層

Demo下載：http://download.csdn.net/detail/wangwangheng/6947607

微信效果：

要實現的效果：

代碼：

strings.xml

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<resources>
    <string name="app_name">平滑移動</string>
</resources>

styles.xml

 1 <resources xmlns:android="http://schemas.android.com/apk/res/android">
 2 
 3     <style name="radioButtonStyle">
 4         <item name="android:layout_width">wrap_content</item>
 5         <item name="android:layout_height">wrap_content</item>
 6         <item name="android:button">@null</item>
 7         <item name="android:textColor">@color/radiobutton_text_color</item>
 8         <item name="android:textSize">20sp</item>
 9         <item name="android:singleLine">true</item>
10         <item name="android:layout_weight">1.0</item>
11         <item name="android:gravity">center</item>
12         <item name="android:paddingLeft">0dip</item>
13     </style>
14 
15 </resources>

res/color/radiobutton_text_color.xml

1 <?xml version="1.0" encoding="utf-8"?>
2 <selector xmlns:android="http://schemas.android.com/apk/res/android">
3     <item android:state_checked="true" android:color="#FF336699"/>
4     <item android:state_checked="false" android:color="#FFFF0000"/>
5 </selector>

布局文件：acitivty_main.xml

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 2     xmlns:tools="http://schemas.android.com/tools"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical"
 6     android:background="#FFFFFFFF">
 7     <RadioGroup 
 8         android:id="@+id/radioGroup"
 9         android:layout_width="match_parent"
10         android:layout_height="wrap_content"
11         android:orientation="horizontal"
12         android:gravity="center"
13         >
14         <RadioButton 
15             android:id="@+id/radioButton1"
16             style="@style/radioButtonStyle"
17             android:text="網易"
18             />
19         <RadioButton 
20             android:id="@+id/radioButton2"
21             style="@style/radioButtonStyle"
22             android:text="天涯"
23             />
24         <RadioButton 
25             android:id="@+id/radioButton3"
26             android:text="鳳凰"
27             style="@style/radioButtonStyle"
28             />
29         <RadioButton 
30             android:id="@+id/radioButton4"
31             android:text="搜狐"
32             style="@style/radioButtonStyle"
33             />
34     </RadioGroup>
35     <LinearLayout
36         android:layout_width="match_parent"
37         android:layout_height="3dip"
38         android:orientation="horizontal">
39 
40         <TextView
41             android:id="@+id/textView"
42             android:layout_width="200dip"
43             android:layout_height="3dip"
44             android:background="#FF336699"
45             android:textColor="#FFFF0000" />
46     </LinearLayout>
47     <View android:layout_width="wrap_content" android:layout_height="1dip" android:background="#FF336699"/>
48 
49     <android.support.v4.view.ViewPager
50         android:id="@+id/viewPager"
51         android:layout_width="match_parent"
52         android:layout_height="match_parent" >
53     </android.support.v4.view.ViewPager>
54 
55 </LinearLayout>

MainActivity.java

  1 package com.example.serviceclient;
  2 
  3 import java.util.ArrayList;
  4 
  5 import android.app.Activity;
  6 import android.graphics.Color;
  7 import android.os.Bundle;
  8 import android.support.v4.view.PagerAdapter;
  9 import android.support.v4.view.ViewPager;
 10 import android.support.v4.view.ViewPager.OnPageChangeListener;
 11 import android.view.Gravity;
 12 import android.view.View;
 13 import android.view.ViewGroup;
 14 import android.view.ViewGroup.LayoutParams;
 15 import android.view.Window;
 16 import android.widget.LinearLayout;
 17 import android.widget.RadioButton;
 18 import android.widget.RadioGroup;
 19 import android.widget.RadioGroup.OnCheckedChangeListener;
 20 import android.widget.TextView;
 21 
 22 /**
 23  * 
 24  * @author wangheng
 25  * 
 26  */
 27 public class MainActivity extends Activity {
 28 
 29     // private TextView textView = null;
 30 
 31     private ViewPager mViewPager = null;
 32     private TextView mTextView = null;
 33     private ArrayList<TextView> mViewList = new ArrayList<TextView>();
 34     
 35     private RadioGroup radioGroup = null;
 36     private RadioButton radioButton1 = null;
 37     private RadioButton radioButton2 = null;
 38     private RadioButton radioButton3 = null;
 39     private RadioButton radioButton4 = null;
 40 
 41     @Override
 42     protected void onCreate(Bundle savedInstanceState) {
 43         super.onCreate(savedInstanceState);
 44         
 45         requestWindowFeature(Window.FEATURE_NO_TITLE);
 46         
 47         setContentView(R.layout.activity_main);
 48 
 49         mTextView = (TextView) findViewById(R.id.textView);
 50 
 51         mViewPager = (ViewPager) findViewById(R.id.viewPager);
 52         
 53         radioGroup = (RadioGroup) findViewById(R.id.radioGroup);
 54         radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {
 55             
 56             @Override
 57             public void onCheckedChanged(RadioGroup group, int checkedId) {
 58                 int current = mViewPager.getCurrentItem();
 59                 switch (checkedId) {
 60                     case R.id.radioButton1:{
 61                         if(current != 0){
 62                             mViewPager.setCurrentItem(0);                            
 63                         }
 64                     }break;
 65                     case R.id.radioButton2:{
 66                         if(current != 1){
 67                             mViewPager.setCurrentItem(1);
 68                         }
 69                     }break;
 70                     case R.id.radioButton3:{
 71                         if(current != 2){
 72                             mViewPager.setCurrentItem(2);
 73                         }
 74                     }break;
 75                     case R.id.radioButton4:{
 76                         if(current != 3){
 77                             mViewPager.setCurrentItem(3);
 78                         }
 79                     }break;
 80                 }
 81             }
 82         });
 83         radioButton1 = (RadioButton) findViewById(R.id.radioButton1);
 84         radioButton2 = (RadioButton) findViewById(R.id.radioButton2);
 85         radioButton3 = (RadioButton) findViewById(R.id.radioButton3);
 86         radioButton4 = (RadioButton) findViewById(R.id.radioButton4);
 87         
 88 
 89         for (int i = 0; i < 4; i++) {
 90             TextView tv = new TextView(this);
 91             tv.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,
 92                     LayoutParams.MATCH_PARENT));
 93             tv.setGravity(Gravity.CENTER);
 94             tv.setTextColor(Color.argb(0xFF, 0x33, 0x66, 0x99));
 95             tv.setTextSize(30);
 96             tv.setText("Page " + (i + 1));
 97 
 98             mViewList.add(tv);
 99         }
100         int width = getWindowManager().getDefaultDisplay().getWidth()
101                 / mViewList.size();
102 
103         mTextView.setLayoutParams(new LinearLayout.LayoutParams(width, dip2px(3)));
104 
105         mViewPager.setAdapter(new PagerAdapter() {
106 
107             @Override
108             public boolean isViewFromObject(View arg0, Object arg1) {
109                 return arg0 == arg1;
110             }
111 
112             @Override
113             public Object instantiateItem(ViewGroup container, int position) {
114 
115                 if (mViewList.get(position).getParent() != null) {
116                     container.removeView(mViewList.get(position));
117                 }
118                 container.addView(mViewList.get(position));
119 
120                 return mViewList.get(position);
121             }
122 
123             @Override
124             public void destroyItem(ViewGroup container, int position,
125                     Object object) {
126                 container.removeView(mViewList.get(position));
127             }
128 
129             @Override
130             public int getCount() {
131                 return mViewList.size();
132             }
133         });
134         mViewPager.setOnPageChangeListener(new OnPageChangeListener() {
135             
136             public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels){
137                 int x = (int)((position + positionOffset) * mTextView.getWidth());
138                 ((View)mTextView.getParent()).scrollTo(-x, mTextView.getScrollY());                
139             }
140 
141             public void onPageSelected(int position){
142                 if(position == 0){
143                     radioButton1.setChecked(true);
144                 }else if(position == 1){
145                     radioButton2.setChecked(true);
146                 }else if(position == 2){
147                     radioButton3.setChecked(true);
148                 }else if(position == 3){                    
149                     radioButton4.setChecked(true);
150                 }
151             }
152 
153             public void onPageScrollStateChanged(int state){
154                 
155             }
156         });
157         
158     }
159     int tmpState = 0;
160     // @Override
161     // public boolean onTouchEvent(MotionEvent event) {
162     // if(event.getAction() == MotionEvent.ACTION_MOVE){
163     // Log.i("wangheng", "x:" + event.getX() + ",y:" + textView.getScrollY());
164     // // textView.scrollTo((int)event.getX(), textView.getScrollY());
165     // ((View)textView.getParent()).scrollTo(-(int)event.getX(),
166     // textView.getScrollY());
167     // textView.scrollTo(-(int)event.getX(), textView.getScrollY());
168     // }
169     // return super.onTouchEvent(event);
170     // }
171 
172     public int dip2px(float dipValue) {
173         final float scale = getResources().getDisplayMetrics().density;
174         return (int) (dipValue * scale + 0.5f);
175     }
176 
177     public int px2dip(float pxValue) {
178         final float scale = getResources().getDisplayMetrics().density;
179         return (int) (pxValue / scale + 0.5f);
180     }
181 
182 }

注意點：

　　1、意滑塊滑動的方式是通過上一級View來實現的、負值以及偏移量的計算方法

　　2、RadioButton的button不顯示的方法，給button屬性設置值為@null.以及【

在使用radiobutton過程中有時候不需要該button的圓點，只保留它的點擊特性即可，這樣我們可以在XML文件中給radiobutton加上android:button="@null"即可。

但是我們會發現修改過后的button文字和圖標無法居中，原因是圓點雖然隱藏了，但是依然占用空間，所以為了居中顯示radiobutton的圖標及文字，再加一行代碼：android:paddingLeft="0dp"這樣就可以實現居中。

】

存在的問題：當Activity從其他狀態恢復的時候，可能導致導航錯誤，需要解決！

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 微信小程序——頁面滑動事件 android actionbar viewpager 實現類微信主界面布局 Android(3)-----模仿微信界面：微信頁面微信小程序（三）頁面跳轉和圖片滑動切換（轉）Android SlidingTabLayout定制分割線和指示條顏色 android:更改PagerTabStrip背景顏色，標題字體樣式、顏色和圖標，以及指示條的顏色解決微信小程序滑動遮罩時底層跟着滑動的問題在主Android Activity中加載Fragment的一般簡易方法，來模擬一個微信界面。微信小程序仿今日頭條nav（可滑動頁面切換tab） python的曲線平滑工具，及python畫一條線中包含不同粗細不同顏色的畫線方法