Skip to main content

 

 

 

 
Language:

 

 
モバイルアプリとリアクティブWebアプリにのみ適用されます
Service Studioバージョン :
 
 
OutSystems

Bottom Bar Item

Bottom Bar Item UIパターンを使用すると、下部のナビゲーションドロワーとフローティングアクションボタンを含む最大4つのアクションへのアクセスを提供できます。1回のタップでコア機能のメイン要素を使用することができ、機能をすばやく切り替えることもできます。

Bottom Bar Item UIパターンの使用方法

  1. Service StudioのツールボックスでBottom Bar Itemを検索します。

    Bottom Bar Itemウィジェットが表示されます。

  2. ツールボックスから、Bottom Bar Itemウィジェットをアプリケーション画面の下部にあるプレースホルダ領域にドラッグします。

    デフォルトで、Bottom Bar Itemウィジェットには[Icon]プレースホルダと[Text]プレースホルダが含まれています。必要に応じてBottom Bar Itemを追加することができます。

    この例では、Bottom Bar Itemをさらに3つ追加しています。

  3. 関連するコンテンツを各Bottom Bar Itemに追加します。

    この例では、リンク付きアイコンとリンク付きテキストを各プレースホルダに追加しています。

これらの手順を実行してモジュールをパブリッシュした後、アプリでパターンをテストできます。

プロパティ

Bottom Bar Item

プロパティ 説明
ExtendedClass(Text型): オプション Bottom Bar Item UIパターンにカスタムスタイルクラスを追加します。CSSを使用して、アプリケーションのカスタムスタイルクラスを定義します。

  • 空白 - カスタムスタイルを追加しません(デフォルト値)。
  • "myclass" - 適用されるBottom Bar Item UIのスタイルに_myclass_というスタイルを追加します。
  • "myclass1" "myclass2" - 適用されるBottom Bar Item UIのスタイルに_myclass1_というスタイルと_myclass2_というスタイルを追加します。
  • Was this article helpful?