iVX入門教程：9 自定義導(dǎo)航欄_第1頁
iVX入門教程：9 自定義導(dǎo)航欄_第2頁
iVX入門教程：9 自定義導(dǎo)航欄_第3頁
iVX入門教程：9 自定義導(dǎo)航欄_第4頁
全文預(yù)覽已結(jié)束

下載本文檔

版權(quán)說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請進(jìn)行舉報或認(rèn)領(lǐng)

文檔簡介

自定義導(dǎo)航欄教學(xué)在本案例中，將會說明一種常用的移動端的制作邏輯以及實(shí)現(xiàn)方法，涉及的知識點(diǎn)有:橫幅組件、行列容器、條件容器和三元表達(dá)式。UI搭建首先我們新建一個網(wǎng)頁應(yīng)用，并選擇畫布尺寸為手機(jī)尺寸。對娜素材嘎目制翎欄DEMQ?▼Z前臺新增一個頁面，命名為“首頁”，并在頁面內(nèi)添加一個列和一個行容器，分別命名為主體和導(dǎo)航欄。本案例我們主要講解導(dǎo)航欄這部分，而主體容器主要是用來放應(yīng)用中期望通過導(dǎo)航欄切換展示的不同頁面內(nèi)容，比如圖片瀑布流、新聞列表等等。我們簡化處理為，切換至A頁，在主體區(qū)域顯示這是A頁。課后，同學(xué)們可以自己練習(xí)的時候，自行添加想展示的內(nèi)容。

在導(dǎo)航欄的行容器中，我們分部添加首頁、分類和我的，由于需要添加圖標(biāo)和文字，這里我們依舊使用行容器。之后，我們將對應(yīng)的圖標(biāo)素材（未被選中和被選中）和文本組件加入進(jìn)去。其中_0為未被選中的灰色圖標(biāo)，_1為被選中時的高亮圖標(biāo)，默認(rèn)初始狀態(tài)是全部未選中，因此需要修改先隱藏所有被選中的圖標(biāo)素材。主體容器的內(nèi)容就比較簡單，只需要使用文本組件，提示被選中的是哪一頁，我們添加三個，分別內(nèi)容為“這是首頁”，“這是分類”和“這是我的”。邏輯實(shí)現(xiàn)第一步，我們需要添加一個數(shù)值變量status來記錄當(dāng)前選中狀態(tài)，默認(rèn)值為0。之后，我們用數(shù)值0表示選中了〃首頁”，數(shù)值1表示選中了〃分類”，數(shù)值2表示選中了〃我的”。[n]status

第二步，給每個導(dǎo)航按鈕添加點(diǎn)擊事件，當(dāng)點(diǎn)擊導(dǎo)航欄中的“首頁”、“分類”或“我的”時，復(fù)制選中狀態(tài)status分別為0,1,2；第三步，接下來我們還需要給主體內(nèi)容添加條件容器，以實(shí)現(xiàn)根據(jù)當(dāng)前選中頁面顯示不同內(nèi)容。?目主缽▼DawT宜B我的?BI苗T密緲T奘密我們設(shè)置條件容器判斷參數(shù)就是剛剛記錄選中狀態(tài)的status變量。

SJna首頁三*SJna首頁三*EldtafM-~V￥0第四步，之前說過導(dǎo)航欄圖標(biāo)我們上傳了兩種樣式的圖片，分別為選中的高亮色和未選中的灰色。選中圖和未選中圖的可見狀態(tài)，

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲空間，僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論