網易新聞控制項的建立，scrollView和viewGroup的學習，和up事件後類比頁面回到固定位置

標籤：

1、viewGroup可以添加控制項，也可以用<include layout="@layout/name">添加xml布局檔案，在本次實驗中將新聞的menu（scrollView布局檔案）和本文（mainnews）加入到繼承ViewGroup的控制項中，但不明白為什麼scrollview的寬度和下滑屬性沒了。導致不能下滑。

　　一旦發現空間幾部分組成就繼承viewgroup ，然後重寫onmeasure方法，在裡面測量所有的孩子，然後重寫layout方法布局這些孩子view的位置。

2瞭解了groupView的原理，並且根據源碼類比當離開螢幕時候螢幕回到首頁面或者menu頁面的過程。（其實menu檔案裡的textview和imageview可以合成一個textview的）

3注意viewgroup裡在ontouchEvent 前面還有onInterceptTouchEvent，它預設的返回為false。其實觸摸事件的傳遞是先通過activity的dispatchTouchEvent調用return super.dispatchTouchEvent(ev)往View裡傳遞，通過view往view的子視圖傳遞，若中途被父view攔截了下面的view就收到不到touch事件，子view收到後就繼續回傳給父view的onTouchEvent最後到activity的onTouchEvent()，因此若在view裡攔截了事件，在activity的ontouchEvent是收不到事件的。以下兩種情況：

事件->onInterceptTouchEvent返回true，就讓自己的ontouhEvent來處理這個事件，下面的只收到Action_CAVCLE。若返回false就不攔截。

事件->onInterceptTouchEvent返回false ->命中view（收到MOVE和UP）如果我處理了事件（即ontouchEvent返回true）-則父view的onInterceptTouchEvent返回true，這樣在activity裡就收不到事件，否則返回false，傳回activity裡。

 

具體可以看：http://blog.csdn.net/xyz_lmn/article/details/12517911，文章下面的幾張圖畫的很清楚。

下面直接看代碼和注釋學習：

public class MyViewGroup extends ViewGroup {private Context context;private int menuX;private Scroller mScroller;public MyViewGroup(Context context) {super(context);mScroller=new Scroller(getContext());this.context=context;// TODO Auto-generated constructor stub}public MyViewGroup(Context context, AttributeSet attrs) {super(context, attrs);this.context=context;mScroller=new Scroller(getContext());// TODO Auto-generated constructor stub}public MyViewGroup(Context context, AttributeSet attrs, int defStyle) {super(context, attrs, defStyle);this.context=context;mScroller=new Scroller(getContext());}int downx2;//這裡可以攔截touch事件，viewgroup這裡預設返回 的是false，導致後面的touchevent接收不到資料,@Override//這裡可以攔截事件public boolean onInterceptTouchEvent(MotionEvent ev) {switch (ev.getAction()) {case MotionEvent.ACTION_DOWN:downx2=(int) ev.getX();break;case MotionEvent.ACTION_MOVE:int dis=(int) ev.getX()-downX;if(dis>10)return true;break;case MotionEvent.ACTION_UP:int dis2=(int) ev.getX()-downX;if(dis2<10)return false;break;default:break;}return true;}int downX;@Overridepublic boolean onTouchEvent(MotionEvent event) {switch (event.getAction()) {case MotionEvent.ACTION_DOWN:downX=(int) event.getX();break;case MotionEvent.ACTION_MOVE:int dis=(int) event.getX()-downX;//scrollTo(-240-dis, 0);if(dis>0){int sx=(int)getScrollX();if(sx>-3*menuX/5)scrollBy(-dis, 0);}else{int sx=(int)getScrollX();;if(sx<0)scrollBy(-dis, 0);}downX=(int) event.getX();break;case MotionEvent.ACTION_UP:int sx=(int)getScrollX();//下面是不類比直接回到固定位置，速度很快//if(sx>-3*menuX/10)//scrollTo(0, 0);//else//{//scrollTo(-menuX*3/5, 0);//end=-menuX*3/5;//}//下面計算類比螢幕滑動到終止位置的位移量，為正時向左劃int end=0;if(sx>-3*menuX/10){end=-sx;}elseend=-3*menuX/5-sx;//這裡可以利用scroller類比螢幕滑動,最後個參數是up事件後螢幕話當到穩定點的時間/* * 4個參數非別為x、y的起始量和位移量 */mScroller.startScroll(sx, 0, end, 0, Math.abs(end)*10);//while(mScroller.computeScrollOffset())//{//int currtX=mScroller.getCurrX();//通過列印x值就清楚螢幕如何滑動的//System.out.println(currtX);//}//如果在類比時候採用重新整理後，它也會去畫它的孩子，然後計算位移量，若計算位移量的時候再遞迴調用重新整理，直到固定位置停止重新整理，就可以讓螢幕跟隨類比的運動達到控制手離開螢幕後的                                // 移動速度了invalidate();//重新整理操作invalidate->drawchlid->chid.draw->computscroll這幾個步驟來更新這個view的，因此我們通過覆寫computscroll，//break;default:break;}return true;}//覆寫computeScroll方法，在方法裡繼續調用invalidate，這樣迴圈位移計算，就可以類比和控制手離開螢幕後視窗移動的操作@Overridepublic void computeScroll() {super.computeScroll();if(mScroller.computeScrollOffset()){int cx=mScroller.getCurrX();scrollTo(cx, 0);invalidate();}}@Overrideprotected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {super.onMeasure(widthMeasureSpec, heightMeasureSpec);View menu=getChildAt(0);menu.measure(widthMeasureSpec, heightMeasureSpec);View news=getChildAt(1);news.measure(widthMeasureSpec, heightMeasureSpec);}@Overrideprotected void onLayout(boolean changed, int l, int t, int r, int b) {View menu=getChildAt(0);menuX=menu.getMeasuredWidth();menu.layout(-3*menuX/5, t, 0, b);View news=getChildAt(1);news.layout(l, t, r, b);}}

　　

activity.xml檔案

<RelativeLayout xmlns: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"    tools:context="com.example.buju.MainActivity$PlaceholderFragment" >             <com.example.buju.MyViewGroup.MyViewGroup         android:layout_width="wrap_content"         android:layout_height="wrap_content">         <!-- 添加菜單 -->        <include layout="@layout/menu" />        <!-- 新聞主介面 -->     <include layout="@layout/maninew"/>              </com.example.buju.MyViewGroup.MyViewGroup></RelativeLayout>

　　

menu.xml檔案：

 

<?xml version="1.0" encoding="utf-8"?><ScrollView xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="240dp"    android:layout_height="wrap_content"    >    <LinearLayout        android:layout_width="wrap_content"        android:layout_height="980dp"        android:orientation="vertical"         android:background="@drawable/menu_bg"         >        <LinearLayout            android:layout_width="match_parent"            android:layout_height="60dp"            android:orientation="horizontal"             >            <ImageView                android:layout_width="wrap_content"                android:layout_height="60dp"                android:background="@drawable/tab_news"                android:paddingBottom="10dp"                android:paddingLeft="5dp"                android:paddingTop="10dp" />            <TextView                android:layout_width="wrap_content"                android:layout_height="wrap_content"                android:layout_marginLeft="10dp"                android:paddingTop="20dp"                android:text="新聞條目2"                android:textSize="20dp"                 android:textColor="@android:color/white"                 />        </LinearLayout>        <LinearLayout            android:layout_width="match_parent"            android:layout_height="60dp"            android:background="@drawable/menu_bg"            android:orientation="horizontal" >            <ImageView                style="@style/menuimagestyle"                android:background="@drawable/tab_news" />            <TextView                style="@style/menutextstyle"                android:text="新聞條目3" />        </LinearLayout>                     <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目4"              />        </LinearLayout>                          <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目5"              />        </LinearLayout>                  <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目6"              />        </LinearLayout>                   <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目7"              />        </LinearLayout>                    <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目8"              />        </LinearLayout>                     <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目9"              />        </LinearLayout>                      <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目10"              />        </LinearLayout>                       <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目11"              />        </LinearLayout>                                       <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目12"              />        </LinearLayout>                                         <LinearLayout             android:layout_width="match_parent"         android:layout_height="60dp"         android:background="@drawable/menu_bg"         android:orientation="horizontal"        ><ImageView     style="@style/menuimagestyle"    android:background="@drawable/tab_news"    />                      <TextView              style="@style/menutextstyle"     android:text="新聞條目13"                   />        </LinearLayout>                      </LinearLayout>    </ScrollView>

　　2、mainnews.xml檔案

<?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" >     <LinearLayout         android:id="@+id/title1"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:orientation="horizontal"    android:background="@drawable/top_bar_bg">     <ImageView     android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:background="@drawable/main_back"    android:id="@+id/back"    />        <ImageView     android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:background="@drawable/top_bar_divider"    android:layout_marginTop="5dp"    android:layout_marginBottom="5dp"    android:layout_toRightOf="@id/back"    /> <TextView     android:layout_width="wrap_content"     android:layout_height="wrap_content"     android:layout_marginBottom="25dp"     android:layout_marginTop="25dp"     android:layout_marginLeft="30dp"     android:gravity="center_vertical"     android:text="網易新聞"     android:textColor="@android:color/white"     android:textSize="30dp" />    </LinearLayout>        <TextView         android:layout_below="@id/title1"       android:layout_width="fill_parent"       android:layout_height="fill_parent"       android:text="釣魚島是中國額，老譚是世界的!"       android:gravity="center"        />        </RelativeLayout>

　　

網易新聞控制項的建立，scrollView和viewGroup的學習，和up事件後類比頁面回到固定位置