十年網(wǎng)站開發(fā)經(jīng)驗 + 多家企業(yè)客戶 + 靠譜的建站團隊
量身定制 + 運營維護+專業(yè)推廣+無憂售后,網(wǎng)站問題一站解決
這篇文章主要介紹了Android view如何實現(xiàn)滑動懸浮固定效果,具有一定借鑒價值,感興趣的朋友可以參考下,希望大家閱讀完這篇文章之后大有收獲,下面讓小編帶著大家一起了解一下。
創(chuàng)新互聯(lián)公司-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價比疏勒網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式疏勒網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們,業(yè)務(wù)覆蓋疏勒地區(qū)。費用合理售后完善,十余年實體公司更值得信賴。1.背景
在項目開發(fā)過程中,有時候會碰到這樣的需求:在滑動的過程中,在某時要將子view固定在頂部(常見的是將界面中的tab在滑動到頂部的時候進行固定)。
之前寫過一篇滑動組件懸浮固定在頂部的文章,但感覺還是有些復(fù)雜,因此就有了這次的實現(xiàn)。效果圖:
2.思路
(CoordinatorLayout+AppBarLayout+CollapsingToolbarLayout)+TabLayout+ViewPager
3.代碼實現(xiàn)
a.主布局代碼
需要注意的是:
app:layout_scrollFlags="scroll|exitUntilCollapsed"——>設(shè)置可以滑動且當前view可以一直退出直到折疊視圖顯現(xiàn)。
b.主界面Activity代碼
public class ScrollingActivity extends AppCompatActivity { private TabLayout tabLayout; private ViewPager viewPager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_scrolling); initViews(); } private void initViews() { tabLayout = (TabLayout) findViewById(R.id.tabLayout); viewPager = (ViewPager) findViewById(R.id.viewPager); viewPager.setOffscreenPageLimit(2); viewPager.setAdapter(new MPagerAdapter(getSupportFragmentManager())); tabLayout.setupWithViewPager(viewPager); } }
c.適配器MPagerAdapter代碼
public class MPagerAdapter extends FragmentStatePagerAdapter { private String[] tabTitle = new String[]{"tab01", "tab02"}; private FirstFragment firstFragment; private SecondFragment secondFragment; public MPagerAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int position) { if (position == 0) { if (firstFragment == null) { firstFragment = new FirstFragment(); } return firstFragment; } else if (position == 1) { if (secondFragment == null) { secondFragment = new SecondFragment(); } return secondFragment; } return null; } @Override public int getCount() { return tabTitle.length; } @Override public CharSequence getPageTitle(int position) { return tabTitle[position]; } }
兩個Fragment的代碼非常簡單。僅僅加載布局而已,所以在此就不貼出來了。
4.擴展
a.關(guān)于CollapsingToolbarLayout中子view的排列順序?qū)︼@示結(jié)果造成的影響
如圖:
可以看到圖中黑色邊框顯示的內(nèi)容不一致,因此ToolBar和ImageView的排列順序會對視圖的顯示結(jié)果造成影響。
推測——>CollapsingToolbarLayout中以上三種view不同排序的剖面展示效果為:
順序:Toolbar——>ImageView——>TabLayout(設(shè)置layout_gravity="bottom")
順序:ImageView——>Toolbar——>TabLayout(設(shè)置layout_gravity="bottom")
不負責任滴猜測:把Toolbar看做一張畫布,只有覆蓋在畫布投射區(qū)域范圍內(nèi)的內(nèi)容才顯示出來在該畫布內(nèi)。
(因此,1.在畫布下的內(nèi)容就無法顯示出來;2.無法覆蓋畫布的內(nèi)容就顯示為畫布默認的樣式)
所以,如果不想要有視差效果的話,那么就將Toolbar與TabLayout的高度設(shè)置一致。如果將Toolbar去掉,那么所有的CollapsingToolbarLayout中的View都會滑出界面,此時布局就變成了普通布局了(相當于CollapsingToolbarLayout變成了CollapsingLayout)。
b.去掉Toolbar實現(xiàn)固定效果
只要將TabLayout從CollapsingToolbarLayout中移到AppBarLayout的一級子View即可。
(這樣也避免了:在CollapsingToolbarLayout中,因為視圖折疊覆蓋的問題,會導(dǎo)致整個ImageView被TabLayout覆蓋一部分而顯示不完全的問題。)
感謝你能夠認真閱讀完這篇文章,希望小編分享的“Android view如何實現(xiàn)滑動懸浮固定效果”這篇文章對大家有幫助,同時也希望大家多多支持創(chuàng)新互聯(lián),關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,更多相關(guān)知識等著你來學(xué)習(xí)!