ナビゲーションで使用するツールバー用コンポーネントです。クラス名により、左、中央、右のコンテナを指定できます。
The Toolbar component displays a navigation bar on the top of a Page component. It is separated into three sections (left, center and right) in order to let the buttons and title be layouted a beautiful way.
A toolbar is displayed on the screen by return the Toolbar component in the renderToolbar property of the Page element. To layout the content the left, center and right classes are used.
<Page
renderToolbar={() =>
<Toolbar>
<div className='left'>Left</div>
<div className='center'>Center</div>
<div className='right'>Right</div>
</Toolbar>
}
/>
| 名前 | 型 / デフォルト値 | 概要 |
|---|---|---|
| inline | ツールバーをインラインに置きます。スクロール領域内にそのまま表示されます。 Optional. 初期化時のみ有効 | |
| static |
Static toolbars are not animated by ons-navigator when pushing or popping pages. This can be useful to improve performance in some situations.
(翻訳中)
Optional.
|
|
| modifier | ツールバーの表現を指定します。 Optional. |
| 名前 | 概要 |
|---|---|
| static |
Static toolbars are not animated by ons-navigator when pushing or popping pages. This can be useful to improve performance in some situations.
(翻訳中)
|
| visible | Whether the toolbar is shown or not. (翻訳中) |
| Name | 概要 |
|---|---|
| material | Material Design toolbar. (翻訳中) |
| transparent | 透明な背景を持つツールバーを表示します。 |
| cover-content |
Displays the toolbar on top of the page’s content. Should be combined with transparent modifier.
(翻訳中)
|
| noshadow | ツールバーに影を付けずに表示します。 |
| シグネチャ | 概要 |
|---|---|
| setVisibility(visible) | Shows the toolbar if visible is true, otherwise hides it. (翻訳中) |
| show() | Show the toolbar. (翻訳中) |
| hide() | Hide the toolbar. (翻訳中) |
Shows the toolbar if visible is true, otherwise hides it. (翻訳中)
| 名前 | 型 | 概要 |
|---|---|---|
| visible | Boolean | Set to true to show the toolbar, false to hide it (翻訳中) |
Show the toolbar. (翻訳中)
Hide the toolbar. (翻訳中)
Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。
バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。
あわせて、下記の情報も参考にしてください。