ÿÿ タブ | フロービルダー | Adapty ドキュメント

タブ

タブã¯ã€ç”»é¢ã®ã‚»ã‚¯ã‚·ãƒ§ãƒ³ã‚’切り替ãˆå¯èƒ½ãªã‚³ãƒ³ãƒ†ãƒ³ãƒ„パãƒãƒ«ã«åˆ†å‰²ã—ã¾ã™ã€‚ユーザーãŒã‚¿ãƒ–ヘッダーをタップã™ã‚‹ã¨ã€ãã®ä¸‹ã®ãƒ‘ãƒãƒ«ãŒå¯¾å¿œã™ã‚‹å†…容ã«åˆ‡ã‚Šæ›¿ã‚りã¾ã™ã€‚

キャンãƒã‚¹ä¸Šã§ã‚¿ãƒ–è¦ç´ ãŒé¸æŠžã•れã€+Add tab コントロールãŒè¡¨ç¤ºã•れã¦ã„る状態

タブã®è¿½åŠ ãƒ»å‰Šé™¤ãƒ»é¸æŠž

å„タブã¯2ã¤ã®ãƒ‘ãƒ¼ãƒ„ã§æ§‹æˆã•れã¦ã„ã¾ã™ã€‚

  • タブヘッダー — クリックã§ãるラベル(Tab 1ã€Tab 2 ãªã©ï¼‰ã€‚
  • タブコンテンツ — タブã”ã¨ã«1ã¤ã®ã‚³ãƒ³ãƒ†ãƒŠã€‚コンテンツコンテナã«é…ç½®ã—ãŸã‚‚ã®ãŒã€ãã®ã‚¿ãƒ–ãŒé¸æŠžã•れãŸã¨ãã«è¡¨ç¤ºã•れã¾ã™ã€‚

Add tab をクリックã™ã‚‹ã¨ã€æ–°ã—ã„タブãŒè¿½åŠ ã•れã¾ã™ã€‚追加ã—ãŸå„タブã«ã¯ã€å¯¾å¿œã™ã‚‹ã‚³ãƒ³ãƒ†ãƒ³ãƒ„コンテナãŒè‡ªå‹•çš„ã«ä½œæˆã•れã¾ã™ã€‚

ç”»é¢ãŒæœ€åˆã«è¡¨ç¤ºã•れãŸã¨ãã«ç‰¹å®šã®ã‚¿ãƒ–をアクティブã«ã™ã‚‹ã«ã¯ã€Selected by default をオンã«ã—ã¦ãã ã•ã„。

タブã®ã‚¹ã‚¿ã‚¤ãƒ«è¨­å®š

テンプレート

タブテンプレート

フロービルダーã§ã¯ã€ã™ãã«ä½¿ãˆã‚‹3種類ã®ã‚¿ãƒ–テンプレートを用æ„ã—ã¦ã„ã¾ã™ã€‚

  • Segment control — é¸æŠžä¸­ã®ã‚¿ãƒ–ã«è§’ä¸¸ã®æž ãŒä»˜ã„ãŸã€ãƒ”ル形状ã®ã‚¹ã‚¤ãƒƒãƒãƒ£ãƒ¼ã€‚
  • Button Tabs — ボタン風ã®ã‚¹ã‚¿ã‚¤ãƒ«ã‚’æŒã¤ç‹¬ç«‹ã—ãŸã‚¿ãƒ–。
  • Underline — é¸æŠžä¸­ã®ã‚¿ãƒ–をアンダーラインã§ç¤ºã™ãƒ†ã‚­ã‚¹ãƒˆãƒ©ãƒ™ãƒ«ã€‚

タブã®çŠ¶æ…‹

å„タブã«ã¯çŠ¶æ…‹åˆ‡ã‚Šæ›¿ãˆï¼ˆDefault / Selected)ãŒã‚りã€ã‚¢ã‚¯ãƒ†ã‚£ãƒ–状態ã¨éžã‚¢ã‚¯ãƒ†ã‚£ãƒ–状態ã®ã‚¹ã‚¿ã‚¤ãƒ«ã‚’ãれãžã‚Œå€‹åˆ¥ã«è¨­å®šã§ãã¾ã™ã€‚テキストスタイルã€è‰²ã€å¡—りã¤ã¶ã—ã€ãƒœãƒ¼ãƒ€ãƒ¼ã‚’状態ã”ã¨ã«å¤‰æ›´ã§ãã¾ã™ã€‚

é¸æŠžã‚°ãƒ«ãƒ¼ãƒ—

タブã¯å˜ä¸€é¸æŠžã‚°ãƒ«ãƒ¼ãƒ—ã§ã™ã€‚常ã«ã²ã¨ã¤ã®ã‚¿ãƒ–ã ã‘ãŒã‚¢ã‚¯ãƒ†ã‚£ãƒ–ã«ãªã‚Šã¾ã™ã€‚グループã®ç®¡ç†ã¯ Screen settings パãƒãƒ«ã® Selectable groups セクションã‹ã‚‰è¡Œãˆã¾ã™ã€‚

グループã¯2ã¤ã®å¤‰æ•°ã‚’æä¾›ã—ã¾ã™ã€‚

  • tabs.selectedOptionId — é¸æŠžä¸­ã®ã‚¿ãƒ–ã®ID。æ¡ä»¶å¼ã§ä½¿ç”¨ã§ãã¾ã™ã€‚
  • tabs.selectedOptionTitle — é¸æŠžä¸­ã®ã‚¿ãƒ–ã®ãƒ©ãƒ™ãƒ«ã€‚動的テキストã§ä½¿ç”¨ã§ãã¾ã™ã€‚

グループåを変更ã—ãŸå ´åˆã¯ã€tabs ã®éƒ¨åˆ†ã‚’カスタム㮠Group ID ã«ç½®ãæ›ãˆã¦ãã ã•ã„。

è©³ç´°ã¯ é¸æŠžå¯èƒ½ãªè¦ç´ ã¨ã‚°ãƒ«ãƒ¼ãƒ— ã‚’ã”覧ãã ã•ã„。

ÿÿÿÿ