實作功能:
1、APP主界面底部子產品欄
2、ViewPager一屏多個界面顯示
3、........
首先需要了解一下這個屬性的意思 ,即
是否允許子View超出父View的傳回,有兩個值true 、false ,預設true
使用的時候給子View和根節點View控件都設定android:clipChildren="false",那麼這個子View就不會限制在父View當中
-------------------------------------------------------------------------------------------------------------
下面通過兩個項目中經常用到的例子來說明:
1、APP主界面底部子產品欄
![](https://img.laitimes.com/img/__Qf2AjLwojIjJCLyojI0JCLicmbw5CMzQTMxITN5ATNxgDM2EDMy8CX1EDOwYTMwIzLcNXZslmZsx2bD9CXlxWamRWYvxGc19CXt92Yu8GdjJjL3d3dvw1LcpDc0RHaiojIsJye.png)
可以看出底部其實有一個ViewGroup(LinearLayout or RelativeLayout 灰色背景部分)
但是我們要求中間一個圖示按鈕 是要比别的稍大點的,那麼正常的我們寫在一個LinearLayout中會出現下面這種情況
因為ViewGroup有高度限制,導緻他也限制了它内部子View的高度,很顯然達不到我們的需求。那麼我們需要一種屬性來讓子View可以不受到父容器的限制
這就要用到了android:clipChildren屬性
我們隻需要給 根節點控件 和 不想被父容器限制的子View 設定這個屬性:android:clipChildren="false" 即可
布局代碼:
<linearlayout android:background=
"#fff"
android:clipchildren=
"false"
android:layout_height=
"match_parent"
android:layout_width=
"match_parent"
tools:context=
"com.xqx.com.treat.ui.user.Login"
xmlns:android=
"http://schemas.android.com/apk/res/android"
xmlns:tools=
"http://schemas.android.com/tools"
>
<linearlayout android:background=
"#ddd"
android:layout_gravity=
"bottom"
android:layout_height=
"45dp"
android:layout_width=
"match_parent"
android:orientation=
"horizontal"
>
<imageview android:background=
"#0000"
android:layout_height=
"match_parent"
android:layout_weight=
"1"
android:layout_width=
"0dp"
android:scaletype=
"fitCenter"
android:src=
"@mipmap/ic_launcher"
>
<imageview android:background=
"#0000"
android:layout_height=
"match_parent"
android:layout_weight=
"1"
android:layout_width=
"0dp"
android:scaletype=
"fitCenter"
android:src=
"@mipmap/ic_launcher"
>
<imageview android:background=
"#0000"
android:layout_gravity=
"bottom"
android:layout_height=
"65dp"
android:layout_weight=
"1"
android:layout_width=
"0dp"
android:scaletype=
"fitCenter"
android:src=
"@mipmap/ic_launcher"
>
<imageview android:background=
"#0000"
android:layout_height=
"match_parent"
android:layout_weight=
"1"
android:layout_width=
"0dp"
android:scaletype=
"fitCenter"
android:src=
"@mipmap/ic_launcher"
>
<imageview android:background=
"#0000"
android:layout_height=
"match_parent"
android:layout_weight=
"1"
android:layout_width=
"0dp"
android:scaletype=
"fitCenter"
android:src=
"@mipmap/ic_launcher"
>
</imageview></imageview></imageview></imageview></imageview></linearlayout>
</linearlayout>
2、實作ViewPager一屏多個視圖滾動
詳細見各大APP應用市場 ,應用詳情界面,會有類似圖檔滾動來顯示應用功能的部分
首先實作該功能我們需要了解ViewPager,安卓開發_深入學習ViewPager控件
了解ViewPager的同學都知道,正常情況下我們一個手機界面隻會顯示出一個viewpager的子View視圖
那麼我們需要實作一個手機界面能看到多個子View視圖該怎麼辦?
其實很簡單,這裡假設大家都會使用ViewPager并且已經寫出了ViewPager的效果
第一步:
我們隻需要在原來基礎上在布局檔案裡對ViewPager控件和它對應的根控件 添加android:clipChildren="false"屬性
第二步:
設定ViewPager的左右margin屬性
?
1 2 3 | |
設定這兩個屬性的目的是什麼呢?
首先,我們正常設定ViewPager控件的寬度都是
?
1 | |
而我們設定距離左右控件的距離之後,就會使ViewPager可現實的寬度變窄,如圖,藍色框部分就是viewpager可見部分
再加上第一步的設定
最終就出現這樣的情況:一個界面我們可以看到至少2個起的viewpager中的子View(橙色,藍色View視圖)
注意點:該做法會有一個bug,就是隻能滑動中間的那個View,而如果我們想要點着左邊或者右邊的View滑動怎麼辦?
解決辦法:将父類的touch事件分發至viewPgaer,R.id.ly是ViewPager控件的父容器
findViewById(R.id.ly).setOnTouchListener(
new
View.OnTouchListener() {
@Override
public
boolean
onTouch(View v, MotionEvent event) {
return
viewpager.dispatchTouchEvent(event);
}
});
另外,activity代碼中給ViewPager控件動态設定間距也會是效果大大提高
?
1 | |
ViewPager滾動效果:
ViewPager切換動畫(3.0版本以上有效果)
效果圖:
布局檔案代碼:
<relativelayout
android:background=
"#fff"
android:clipchildren=
"false"
android:id=
"@+id/ly"
android:layout_height=
"match_parent"
android:layout_width=
"match_parent"
android:paddingbottom=
"@dimen/activity_vertical_margin"
android:paddingleft=
"@dimen/activity_horizontal_margin"
android:paddingright=
"@dimen/activity_horizontal_margin"
android:paddingtop=
"@dimen/activity_vertical_margin"
tools:context=
"com.xqx.com.treat.ViewPagerActivity"
xmlns:android=
"http://schemas.android.com/apk/res/android"
xmlns:tools=
"http://schemas.android.com/tools"
>
</android.support.v4.view.viewpager>
</relativelayout>
轉載自http://www.2cto.com/kf/201608/537822.html