1. 程式人生 > >Android仿今日頭條首頁的頂部標籤欄和底部導航欄

Android仿今日頭條首頁的頂部標籤欄和底部導航欄

//主頁 public class MainActivity extends AppCompatActivity implements View.OnClickListener { //初始化fragment private HomePageFragment mHomePageFragment; private MatchPageFragment mMatchPageFragment; private RecommendPageFragment mRecommendPageFragment; private MinePageFragment mMinePageFragment; //片段類容 private
FrameLayout mFlFragmentContent; //底部4個按鈕 private RelativeLayout mRlFirstLayout; private RelativeLayout mRlSecondLayout; private RelativeLayout mRlThirdLayout; private RelativeLayout mRlFourLayout; private ImageView mIvFirstHome; private TextView mTvFirstHome; private ImageView mIvSecondMatch; private
TextView mTvSecondMatch; private ImageView mIvThirdRecommend; private TextView mTvThirdRecommend; private ImageView mIvFourMine; private TextView mTvFourMine; private FragmentManager mFragmentManager; private FragmentTransaction mTransaction; @Override protected void onCreate(Bundle savedInstanceState) { super
.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mFragmentManager = getSupportFragmentManager(); //=============================沉侵式狀態列S================================ //設定狀態列顏色,必須在setContentView之後使用 //第一個引數:當前頁面;第二個引數:顏色;第三個引數:透明度; StatusBarUtil.setColor(this, getResources().getColor(R.color.colorStatusBar), 0); //=============================沉侵式狀態列E================================ initView(); //初始化檢視 } //此方法可以讓app啟動頁像微信一樣,第一次(啟動頁執行),第二次(無啟動頁,直接進入主介面) // @Override // public void onBackPressed() { // //super.onBackPressed(); 不要呼叫父類 // Intent intent = new Intent(Intent.ACTION_MAIN); //ACTION_MAIN主活動 // intent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK); //標誌活動新任務 // intent.addCategory(Intent.CATEGORY_HOME); //型別 // startActivity(intent); // } private void initView() { mFlFragmentContent = (FrameLayout) findViewById(R.id.fl_fragment_content); mRlFirstLayout = (RelativeLayout) findViewById(R.id.rl_first_layout); mIvFirstHome = (ImageView) findViewById(R.id.iv_first_home); mTvFirstHome = (TextView) findViewById(R.id.tv_first_home); mRlSecondLayout = (RelativeLayout) findViewById(R.id.rl_second_layout); mIvSecondMatch = (ImageView) findViewById(R.id.iv_second_match); mTvSecondMatch = (TextView) findViewById(R.id.tv_second_match); mRlThirdLayout = (RelativeLayout) findViewById(R.id.rl_third_layout); mIvThirdRecommend = (ImageView) findViewById(R.id.iv_third_recommend); mTvThirdRecommend = (TextView) findViewById(R.id.tv_third_recommend); mRlFourLayout = (RelativeLayout) findViewById(R.id.rl_four_layout); mIvFourMine = (ImageView) findViewById(R.id.iv_four_mine); mTvFourMine = (TextView) findViewById(R.id.tv_four_mine); //給五個按鈕設定監聽器 mRlFirstLayout.setOnClickListener(this); mRlSecondLayout.setOnClickListener(this); mRlThirdLayout.setOnClickListener(this); mRlFourLayout.setOnClickListener(this); //預設第一個首頁被選中高亮顯示 mRlFirstLayout.setSelected(true); mTransaction = mFragmentManager.beginTransaction(); mTransaction.replace(R.id.fl_fragment_content, new HomePageFragment()); mTransaction.commit(); } @Override public void onClick(View v) { mTransaction = mFragmentManager.beginTransaction(); //開啟事務 hideAllFragment(mTransaction); switch (v.getId()){ //首頁 case R.id.rl_first_layout: seleted(); mRlFirstLayout.setSelected(true); if (mHomePageFragment == null) { mHomePageFragment = new HomePageFragment(); mTransaction.add(R.id.fl_fragment_content,mHomePageFragment); //通過事務將內容新增到內容頁 }else{ mTransaction.show(mHomePageFragment); } break; //賽程 case R.id.rl_second_layout: seleted(); mRlSecondLayout.setSelected(true); if (mMatchPageFragment == null) { mMatchPageFragment = new MatchPageFragment(); mTransaction.add(R.id.fl_fragment_content,mMatchPageFragment); //通過事務將內容新增到內容頁 }else{ mTransaction.show(mMatchPageFragment); } break; //推薦 case R.id.rl_third_layout: seleted(); mRlThirdLayout.setSelected(true); if (mRecommendPageFragment == null) { mRecommendPageFragment = new RecommendPageFragment(); mTransaction.add(R.id.fl_fragment_content,mRecommendPageFragment); //通過事務將內容新增到內容頁 }else{ mTransaction.show(mRecommendPageFragment); } break; //個人中心 case R.id.rl_four_layout: seleted(); mRlFourLayout.setSelected(true); if (mMinePageFragment == null) { mMinePageFragment = new MinePageFragment(); mTransaction.add(R.id.fl_fragment_content,mMinePageFragment); //通過事務將內容新增到內容頁 }else{ mTransaction.show(mMinePageFragment); } break; } mTransaction.commit(); } //設定所有按鈕都是預設都不選中 private void seleted() { mRlFirstLayout.setSelected(false); mRlSecondLayout.setSelected(false); mRlThirdLayout.setSelected(false); mRlFourLayout.setSelected(false); } //刪除所有fragmtne private void hideAllFragment(FragmentTransaction transaction) { if (mHomePageFragment != null) { transaction.hide(mHomePageFragment); } if (mMatchPageFragment != null) { transaction.hide(mMatchPageFragment); } if (mRecommendPageFragment != null) { transaction.hide(mRecommendPageFragment); } if (mMinePageFragment != null) { transaction.hide(mMinePageFragment); } } }

相關推薦

Android仿今日頭條頂部標籤底部導航

//主頁 public class MainActivity extends AppCompatActivity implements View.OnClickListener { //初始化fragment private HomePageFragment mHomePageFragment; pr

Android 仿今日頭條標題效果

今天帶來的是仿今日頭條首頁的聯動滑動效果,廢話不多說,先上效果圖: 思路: 做這個我們需要實現的效果有 1、滑動內容區域,標題欄會有變化來顯示當前所處的位置。 2、點選標題欄,內容區域也會隨著滑動並跳到指定欄,標題欄會移動到螢幕中間。 3、當標題欄

React Native之仿今日頭條

      今日頭條應用想必大家應該都不陌生,絕對稱得上今日之星。媒體上面已經所向披靡,PK掉微信公眾號是遲早的事情,我祝今日頭條再創輝煌!       首先我們先看下今日頭條的首頁:              這裡提到一個開源框架:react-native-scrolla

Android頂部狀態列底部導航高度計算

專案開發中,經常會遇到介面適配的問題,狀態列和導航欄的高度計算,直接影響著App的展示效果,下面就來看一下兩種控制元件高度是如何計算的。 1, 頂部狀態列(status bar) private

Android仿微信下拉顯示小程式列表

花點時間重新熟悉一下AndroidUI方面的東西,把古董PullToRefreshView又擼了一遍,技術這種東西真是忘得快啊...在基礎上新增一點東西,粗糙地實現了仿微信首頁下拉顯示小程式列表的樣式,是的,粗糙粗糙... PullToRefreshView原始的實現思路: 1.垂直方向的L

Selenium元素定位初探(以今日頭條為例)

隨著網頁技術的發展,動態網頁的比例越來越高,原來抓取靜態網頁的許多方法變得不再適用;再加上越來越多的網站添加了各種複雜的反爬蟲策略,導致直接通過網路請求的方式去抓取頁面的方式已經有些落伍了。 而Selenium可以通過模擬瀏覽器的真實行為來訪問網頁並將頁面原始碼快取下來,從而實現所見

android仿今日頭條App、多種漂亮載入效果、選擇器彙總、記事本App、Kotlin開發等原始碼

Android精選原始碼 android漂亮的載入效果 android各種 選擇器 彙總原始碼 Android仿bilibili搜尋框效果 Android記事本app、分類,塗鴉、新增圖片或者其他附件 仿今日頭條app 一個很酷的Vi

Android 仿今日頭條頻道管理(上)(GridView之間Item的移動拖拽)

前言 經常逛今日頭條、發現它的頻道管理功能做的特別贊,互動體驗非常好、如圖: 它是2個gridview組成、2個gridview之間的Item是可以相互更換的、而且我的頻道的Item是可以拖拽進行排序。仔細觀察、今日頭條有些細節做的的非常好,當一個gridview1的item移

仿UC頭條-html+css+純JS

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>仿UC頭條</title> <s

android仿今日頭條下拉重新整理中的vector動畫

一直有留意到今日頭條下拉重新整理的效果, 真的很贊,在學習了svg drawable相關資料後, 參考部落格http://blog.csdn.net/u012950099/article/details/52040028完成了今日頭條下拉重新整理中的動畫, 首先看下效果圖:

android仿支付寶更多、應用編輯介面

[github地址](https://github.com/oldbirdy/recyclerdemo “github地址”) 專案越來越大,模組越來越多,首頁上展示的東西又不能全部都展示出來,只能選擇幾個重要的模組展示出來。但是不同的使用者關注的層面不一樣,只

簡單實現Android頂部工具底部工具

直接上圖,有圖有真相。 這兩個工具欄全是用佈局來實現的。 底部工具欄佈局程式碼: <?xml version="1.0" encoding="utf-8"?><RelativeLayout     ="http://schemas.androi

android頂部底部導航

來源: http://www.linuxidc.com/Linux/2012-07/66327.htm   效果圖。 原始碼 http://download.csdn.net/detail/qq1761310972/4152778

Android之高仿今日頭條、網易新聞動態改變tab

前言: 專案需要一個類似今日頭條或者網易新聞首頁動態改變tab(頻道欄目)的功能,進過一番折騰,目前已實現該功能。 先看看效果圖: 思路: 1,關於tab欄目橫著滑動功能控制元件的選擇,這裡我採用的Horizontal

Android仿今日頭條頂部導航效果

隨著時間的推移現在的軟體要求顯示的內容越來越多,所以要在小的螢幕上能夠更好的顯示更多的內容,首先我們會想到底部選單欄,但是有時候像今日頭條新聞客戶端要顯示的內容太多,而且又想在主介面全部顯示出來,所以有加了頂部導航欄。 今日頭條頂部導航欄區域的主要部分是一個導航選單。導航選

android仿今日頭條小視訊轉場切換效果

可以先看看今日頭條效果 功能分析 點選列表上的一個item,該item會放大,最後直接全屏播放小視訊,剛開始看上去,以為是個共享元素的轉場動畫, 後來想到,共享元素要在android 5.0以上支援,而今日頭條顯然不會只支援5.0版本以上 筆者想到的一種方案就是進入Acti

Android 利用ViewPager+GridView,仿美團導航分類佈局介面

先看美團的效果: 再看我們山寨的效果: 最初我是使用VIewPager+RecyclerVIew實現的,發現在左右滑動的時候,有問題,經常滑動不了,應該是RecyclerVIew消費了Touch事件,所以棄用這個方法了(效果圖是下面的效果,為了區別VIew頁面,每

Android之高仿京東APP“京東快報”自動向上滾動的廣告條

##前言 上次在京東APP上買東西時,發現首頁中間有塊叫“京東快報”的欄目,其中廣告條能自動向上滾動,效果還不錯,看到這個效果,第一個念頭就是我能不能實現,於是就誕生了這篇文章。 我們看看實現後的效果: ##實現原理 起初看到這個效果時,第一個想法就是向上移

Android實現仿網易選項卡動態滑動效果

本文會實現一個類似網易新聞(不說網易新聞大家可能不知道大概是什麼樣子)點選超多選項卡,選項卡動態滑動的效果。  首先來看看佈局,就是用HorizontalScrollView控制元件來實現滑動的效果,裡面包含了一個佈局。 <code class="hljs xml has-numbering" st

js實現左右滑動的導航選單,仿今日頭條頂部選單

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <t