App二級頁面怎麼做

『壹』 商城APP搭建需要准備什麼

這個搭建的話，他無非就是資料的問題，包括認證的資料和搭建商城用的素材，視頻，照片，以及需要上架的商品的資料。
認證的這部分要根據運營商的不同，准備不同的資料，一般是身份證和營業執照，和收款的銀行卡手機號，市場上基本都是需要營業執照要收款的，據我了解，廣州的軟貓引擎是個人身份證就 可以開通
首先第一步要明確框架結構，包括主題色調，呈現給客戶的是要達到什麼樣的效果
第二部步就是正對每一個UI頁面的部件進行增加調整修改，這個包括提前上架好相應的產品，好讓產品在界面展示。接下來就是二級三級頁面的搭建，完成後對每一個頁面每一個組件做一個跳轉功能，基本的商城就以及成型了。

『貳』 uniapp項目實踐總結(七)編寫一個簡單的應用頁面

之前已經自定義了頂部和底部導航欄，現在我們將編寫一個簡單的二級頁面，這是除了導航頁面之外，經常需要用到的。

一個普通頁面的結構通常如下所示：

uniapp 內置了常用的組件，可以直接使用，與微信小程序類似。

樣式支持css、scss、less、stylus，支持@import導入外部樣式表。

支持以下通用尺寸：

nvue 不支持，vue 支持：

nvue 不支持百分比;

uni-app 中頁面的寬度計算公式為：750 * 元素在設計稿中的寬度 / 設計稿基準寬度；

例如：

使用@import 'path/name.scss';

例如：

App.vue中的樣式即為全局樣式，對於每一個頁面通用，nvue 頁面不支持全局樣式。

在組件的屬性中使用 class 或者 style 添加樣式。

在 uniapp 中，*選擇器無效，page相當於body，微信小程序僅支持class選擇器。

使用@font-face自定義字體。

以下是一些js中的內容。

這里重點關注生命周期，包括頁面的組件的生命周期。

常用到的就是onLaunch，onLoad，onShow，onHide等鉤子函數。

常用到的就是created，onLoad，onShow，onHide等鉤子函數。

以下都是 vue3 中的setup 語法糖下面的使用場景。

導入你要使用的方法。

在pages.json配置:

導入你要使用的方法。

例如：

例如：

父組件接收:

例如：

vuex 狀態管理，主要是引入和使用。

在pages/index文件夾下面新建一個list.vue的文件，在pages.json注冊路由。

在uni.scss裡面定義以下全局變數。

一個導航頁麵包括狀態欄、頂部導航欄、中間內容區和底部導航欄四塊區域，一個普通的頁面就是沒有底部導航欄。

可以在之前的styles文件夾的global.scss裡面定義全局樣式規則，包括整體頁面，中間部分，狀態欄部分的樣式。

以上就是編寫一個簡單的應用頁面的主要內容，有不足之處，請多多指正。

『叄』 移動APP的常見的幾種導航形式

當確定了APP的設計需求和產品的整體結構之後，要著手開始規劃和製作APP的原型及UI界面。一款APP的好與不好，很大部分取決於APP界面布局的合理性。這個時候就要想以最優的設計結構將APP的內容展現給用戶，那麼，如何將信息以最優的形式展現出來呢？這就涉及到了APP的導航應用方式，可以說一個優秀的導航設計對一款App的核心體驗起到了決定性的作用！

知道了導航的重要性，在考慮導航設計時，需要注意以下事項：

1.可達性：

移動應用的導航功能可以說是所有界面最重要的組成部分，因此一定要保證其可達性，並把最關鍵的要素盡量突出，同時不要影響到內容本身。

2.目的性：

確保導航中的每個按鈕要素簡單明了，有明確的引導用戶點擊的目的性。讓用戶一看就知道是什麼意思以及操作結果是什。不要弄的太過花哨，這樣反而會讓迷惑用戶，起到反作用。

3.易於理解：

如果想設計比較高級的導航功能（例如鏈接圖片、允許滑動或其他手勢導航，或者訪問隱藏菜單），請務必在設計過程中保證前後一致，以便用戶熟悉你所使用的模式，同時還應加入一些額外的信息（例如小箭頭、文字或改變顏色或高亮等）來吸引用戶注意力，並以微妙的方式對用戶進行引導。不要給用戶呈上「看得見摸不著的導航功能」。

4.通用性

導航功能應當以一定的形式顯示於移動應用的各個界面。各個導航模式不一定要完全相同，但其基本結構應當在應用內保持一致，可以根據背景進行小幅度的調整。

明確上述幾點注意事項後，將APP的信息結構分層，把主要、最核心、最根本的功能放在第一層級，次要內容放在第二層級甚至更深。然後根據層級關系、結構關系確定導航的形式。

結合產品的深度和廣度來共同探討一下目前APP界面常見的幾種導航形式，並分析其優缺點，從而進一步判斷每一種導航形式更適合應用於哪種類型的APP！

標簽式導航，也就是常說的Tab式導航。是目前應用最廣泛、最常見的導航形式。

標簽式導航可分為 頂部標簽式導航、底部標簽式、舵式導航（底部擴展式導航）。

頂部標簽式導航

頂部標簽式導航顧名思義，存在於頁面的頂部。頂部標簽導航多應用於Android平台，因其平台特性，底部含有虛擬的物理按鍵，如華為手機存在手機屏幕內的物理按鍵。

很多App為了適配安卓平台，採用了頂部標簽式導航，目的是為了不與底部虛擬按鈕組合在一起產生的信息堆疊和誤操作，這也是一種妥協行為。但不斷升級的Android平台app現如今也和ios盡量保持一致。

不過也有很多ios平台根據產品結構應用此類型的導航。

上圖是蝦米音樂app首頁導航模式，採用了頂部標簽式導航。這樣設計是為了 更多展示標簽下的內容，還有一點是支持快捷操作 。方便展示/點擊下方快捷區域的內容和按鈕（當前曲目、歌手、播放/暫停和下一曲）。

底部標簽式導航

底部標簽式導航是最常用的導航形式，一般存在於頁面底端，不超過5個模塊。

如果應用需要用戶 頻繁的在不同分頁切換 ，可以採用這種導航，如上圖微信最新版的APP界面設計圖。這種導航欄符合拇指操作熱區。

舵式導航（底部擴展式導航）

舵式導航是底部導航的一種擴展形式，是一種變體。因為它的樣式很像輪船上用來指揮的船舵，兩側是其他操作按鈕。

當頁面有處於同一層級的幾大部分內容，同時又需要一個非常重要且頻繁操作的入口 ，就可以採用這種APP導航模式。 中間項標簽不緊操作最頻繁，最重要，且需要引人注意，方便尋找 。

左圖為懶人聽書App，右圖為新浪微博手機客戶端。兩款App的主要功能都採用了舵式導航的布局方式，將操作最頻繁的按鈕進行特殊處理，在視覺設計上突出，與導航上的其他按鈕進行區分，引導用戶操作。

頂部導航+底部導航（雙導航模式）

今日頭條和網易新聞這種新聞類APP，由於內容、分類較多，運用頂部和底部雙tab導航，而切換頻率最高的tab放在頂部，這是為什麼呢？因為新聞在每個tab都是沉浸式閱讀，最常用的操作是在一個tab中不斷地下滑閱讀內容，將常用的tab放在頂部，向左或向右滑動切換tab的手勢操作，能帶來更好地閱讀體驗。

在兩種情況下可以選擇頂部tab式導航：某項功能必須固定在底部，那麼其他tab只能固定在頂部，但為了方便操作，頂部tab導航最好支持手勢操作，即滑動即可切換;該APP是沉浸式體驗，如新聞、小說等，為了帶給用戶更好的閱讀體驗，可以將tab放在頂部。

實際上，底部Tab模式導航在iOS和Android上一直是最安全的一種導航模式，他不怎麼出彩，但是絕對不會犯錯。在大屏幕時代，底部Tab模式的導航更能適應，也更好設計。

適用於：

入口分類數目不多，可以控制在5個以內，且用戶需要在入口間頻繁切換來執行多個任務

注意：

結構太過復雜而且不穩定的應用不適合標簽式導航。

抽屜式導航模式一般採用將導航主體隱藏在app側邊的方式，以一個按鈕來呼出導航，在使用完成之後在使用相同的按鈕隱藏起來。一拉一縮，從形象上與抽屜類似，因此稱之為抽屜式導航。

抽屜式導航的核心思路是「隱藏」。隱藏非核心的操作與功能，讓用戶更專注於核心的功能操作上去。 設想你的產品信息層級有非常多的頁面和內容，難以在一屏內顯示全部內容，那麼你一定首先會想到去設計一個底部或頂部的tab導航，但導航太多無疑顯得臃腫，而且使用戶難以點擊，那麼這個時候，抽屜式導航是個不錯的選擇。

抽屜式導航存在幾個缺陷：

1.左上角的導按鈕存在於單手拇指操作熱區難以到達的位置，導致導航按鈕難以觸達；2.降低了用戶對產品一半的參與度；3.可見性低。

有些人認為「現在的APP的發展不僅僅是從前單一的功能，功能隨產品的發展變得越來愈多，抽屜式導航已經不適應大多數的產品，這種導航終將被遺棄」。但是，導航欄的使用方式並不是單純隨著看產品的功能增加而不被使用，而是隨著整個產品的信息結構和功能形式來設計決定的。拋開產品的功能表現而去講產品設計是不合理的。

何種情況下適合使用抽屜式導航：

1.如果應用主要的功能和內容都在一個頁面裡面。只是一些低頻操作內容需要顯示在其他頁面里。為了讓主頁面看上去干凈美觀，可以把這些輔助功能放在抽屜欄里。

2.如果應用有不同的視圖，且他們是平級的，需要用戶同等地對待，抽屜欄將會浪費掉大多數的用戶對於側邊欄中入口的潛在參與度和交互程度。

3.在大屏時代使用抽屜欄，手勢操作顯得尤為重要，從屏幕邊緣喚出抽屜欄是個不錯的選擇。

注意：

需要用戶有一定參與的信息層級，最好不好放置在抽屜欄

跳板／快速啟動／宮格導航是將主要入口全部聚合在頁面，讓用戶做出選擇。

採用這種導航的應用已經越來越少， 往往用在二級頁作為內容列表的一種圖形化形式呈現，或是作為一系列工具入口的聚合。 如下圖新浪微博，點擊導航欄中間的發布按鈕，彈出二級菜單，這個二級頁面就是採用的宮格式導航，作為發布微博的入口。

這種導航模式非常常見，但是卻不常用。

無論你用的是Android還是iOS，每天一打開手機，宮格式導航就會對你說hello了。

每一個APP都是一個宮格，這些宮格聚集在中心頁面，用戶只能在中心頁面進入其中一個宮格，如果想要進入另一個宮格，必須要先回到中心頁面，再進入另一個宮格。每個宮格相互獨立，它們的信息間也沒有任何交集，無法跳轉互通。因為這種特質，宮格式導航被廣泛應用於各平台系統的中心頁面。

宮格式導航的缺陷 ：

信息互斥，無法相互通達，只能給用戶帶來了更多的操作步驟。無法讓用戶在第一時間看到內容，選擇壓力較大。

何種情況下適用於宮格式導航：

適合入口相互獨立互斥，且不需要交叉使用的信息歸類

注意：

一旦入口需要有所交集，必然導致更多的操作負累，這個時候只能根據產品特性做出權衡，如果不適合，建議果斷拒絕這種方式。

列表式導航結構清晰，易於理解，冷靜高效，能夠幫助用戶快速的定位去到對應的頁面。作為輔助導航來展示二級甚至更深層級的內容

列表式導航分為3類： 標題式列表、內容式列表、嵌入式列表。

標題式列表 :一般只顯示一行文字，有的顯示一行文字加一張圖片等等。

內容式列表： 主要以內容為主，所以在列表中就會體現出部分內容信息，點擊進去就是詳情。

嵌入式列表： 嵌入式其實就是由多個列表層級組合而成的導航。能很好的解決次要功能非常多的問題

所有關於列表導航的例子大部分都是依附於標簽導航之上的。前面我就說過現在以列表形式作為主導航的產品是越來越少，因為確實它不是一個好的主要展示形式。 列表項目可以通過間距、標題等進行分組，形成擴展列表。 列表菜單導航可以將重要的UI部分以列表的形式進行呈現，讓用戶可以滾動查看自己要執行的操作或內容。

而在二次層級上，它們還會 將列表分模塊進行展示 ，如微信中「我的」模塊「新消息通知、隱私、通用」是一組，「幫助與反饋、關於微信」又是一組。雖然你能看到，但是不仔細觀察就不會發現其中的要點。只要善用這個細節，可以更好的加以區分次要功能，並提升用戶體驗度。

懸浮icon導航，是將導航頁面分層，無論你到達APP的哪個頁面，懸浮icon永遠懸浮在上面，你依靠懸浮層隨時可以去想要去的地方。

懸浮式icon會遮擋某些頁面的操作，在設計的時候應該考慮進去，比如無論在那個頁面永遠為懸浮icon留有位置。

標簽式導航： 最常用、最不易出錯，請第一時間考慮它

抽屜式導航： 如果你的信息層級繁多，可以考慮將輔助類內容放在抽屜中

跳板式／宮格式導航： 不建議在APP中作為主導航使用，如果非使用不可，請增加跳轉的關聯性

列表式導航： 作為輔助導航來展示二級甚至更深層級的內容，每個APP必不可少，但請注意數量與分類

懸浮式導航： 更適應大屏的導航模式，不妨試一試，但注意不要讓它遮擋住某些頁面的操作

還是那句話，優秀的app導航設計，能夠合理地完美展示產品的功能，並快速引導用戶使用，增強用戶的識別度。合理的導航設計，會讓用戶輕松達到目的而又不會干擾和困擾用戶的選擇。

感謝大家的耐心閱讀，還有一路陪伴的行業大牛為我指點迷津！如果內容觀點有不對的地方，歡迎批評指正！

『肆』 APP的一級頁面，二級頁面是怎麼劃分的

輸入考試吧網站域名進入考試森攜缺吧首頁，這就是一級頁面，然後再點擊它上面的「英語」或者「計算機「類別，就進入了二級頁面。

二級頁面就是在一級頁面上的鏈接，當然一級頁面指網站主頁的鏈接的頁面。動態2級頁面就是指的在動態網頁中。

(4)App二級頁面怎麼做擴展閱讀：

通過超鏈接鏈接到隱含某文件（如DOC，習，SGML等）。元數據與語義的元信息，字元集信息，文件類型描述（DTD），等等。網頁實際是一個文件，它存放在世界某個角落的的某一台計算機中，而這台計算機必須是與互聯網相連的。

網頁經由網址（URL）來識別與存取，當我們在瀏覽器輸入網址後，經過一段復雜而又快速的程序。網頁文件會被傳送到你的計算機，然後再通此辯過瀏覽器解釋網頁的內容，再展示到你的眼前。

『伍』 什麼是APP的一級界面和二級界面

我們拿考試吧的網站來舉例吧，輸入考試吧網站域名進入考試吧首頁，這就是一級頁面，然後再點擊它上面的「英語」或者「計算機「類別，就進入了二級頁面，比如說我們剛點擊的是計算機等級考試進入的二級頁面，在計算機等級考試的頁面中點擊「計算機一級」就進入了三級頁面。