1 10 ionic3 懸浮按鈕 ion fab

2022-07-16 00:03:20 字數 505 閱讀 8726

ion-fab類似於ios裝置上的懸浮按鈕,點選以後會彈出隱藏起來的一些按鈕,達到快捷的作用,在ionic官方文件為 , 我直接貼原始碼了

(1)懸浮按鈕 ion-fab

(2)屬性

可以看到我用了right和middle兩個屬性,使得我的懸浮按鈕位於螢幕右方的中間部位

其他的屬性有:

top 將懸浮按鈕放在螢幕的頂部

bottom 將懸浮按鈕放在螢幕的底部

left 將懸浮按鈕放在螢幕的左邊

right 將懸浮按鈕放在螢幕的右邊

middle 將懸浮按鈕放在螢幕垂直線的中心

center 將懸浮按鈕放在螢幕水平線的中心

edge 用於將容器放在content和header之間,或在content和footer之間

(3)缺點

從上面的屬性中我們沒有找到像iphone懸浮按鈕那樣的功能,不能隨著手指的拖拽而移動,它的位置都是固定的,失去了懸浮按鈕的本質

ionic3 常用指令

npm install 安裝依賴 npm install g cnpm registry 映象源指向 cnpm install g cordova ionic 安裝cordova ionic cnpm update g cordova ionic 更新cordova ionic ionic help...

安裝使用ionic3

1 安裝ionic3 npm install g ionic latest 2 建立ionic3專案 ionic start mynewproject blank 3 啟動ionic3專案 cd mynewproject ionic serve 4 以cordova的方式啟動專案 如果 中使用了io...

Ionic開發入門教程 3

今天繼續來翻譯一篇,平時時間不多,只能零碎著來 步驟1,開啟乙個新的命令列視窗,然後導航到ionic tutorial目錄下 ionic start conference sidemenu3,導航到conference資料夾 cd conference4,使用ionic serve命令,啟動服務 i...