本サイトは docs.flutter.dev / Large screen devices のリファレンスブログです。
１．UIデザイン（大画面ギャラリー）
「UIデザイン（大画面ギャラリー）」には大画面における最適化されたUIデザインがギャラリーとして提供されています。（このURLは本来Android開発者向けサイトなのですが、docs.flutter.devでは、大画面レイアウトの部分を切り取って参考にする、という形式で紹介されています。）
１-１．ソーシャルメディア
１-２．メディア
１-３．仕事効率化
１-４．ショッピング
１-５．読書
１-６．想像力
１-７．ゲーム
２．マテリアルデザイン３
ご周知の「マテリアルデザイン３」ですが、ここでも参照先として紹介されています（･･･ので、以下、レジュメになります。）
２-１．HOME
（１）News & launches
（２）Design system updates
（３）Resources
２-２．Get started
２-３．Develop
- Flutter
- Material 3 from design to deployment
- Material 3 GitHub issue
- Build an animated responsive layout
- Opt-in with useMaterial3 flag
- Flutter.dev
- Take your Flutter app from boring to beautiful
- 5 Steps to prepare your app for large screens
- Material Motion in Flutter and Android
- Material 3 Canonical layouts
- Material Flutter widget catalog
- Sample app: Wonderous
- Web
２-４．Foundations
- Accessibility
- Content design
- Customizing Material
- Design tokens
- Interaction states
- Layout
- Material A-Z
- Banner
- Button
- Bottom app bar
- Bottom sheet
- Card
- Checkbox
- Chip
- Color: Baseline scheme
- Color: Dynamic color
- Color: Extended color
- Color: Key color
- Color: Scheme
- Color: Source color
- Color: Tonal palette
- Color: Tone
- Color: User-generated schemes
- Contrast
- Customization
- Dark theme
- Data table
- Date picker
- Design attribute
- Design guidelines
- Design specs
- Design System Package ( DSP )
- Design tokens
- Design tokens: Context
- Design tokens: Role
- Design tokens: Types
- Design tokens: Value
- Dialog
- Divider
- Element
- Extended FAB
- Floating action button ( FAB )
- HCT
- Image list
- Libraries
- List
- Material Components
- Material Design
- Material Theming
- Menu
- Mode
- Navigation bar
- Navigation drawer
- Navigation rail
- Progress indicator
- Radio button
- Role
- Side sheet
- Slider
- Snackbar
- Style
- Switch
- Tab
- Text field
- Theme
- Time pickker
- Tooltip
- Top app bar
２-５．Styles
- Color
- Color system
- Color roles
- What are color roles ?
- General concepts
- Primary
- Secondary
- Tertiary
- Error
- Surface
- Outline
- Add-on color roles
- Color schemes
- Choosing a scheme
- Static color
- Dynamic color
- Static
- Dynamic
- Choosing a scheme
- Advanced
- Color resources
- Elevation
- Icons
- Motion
- Shape
- Typography
２-６．Components
- Overview
- App bars
- Bottom app bar
- Top app bar
- Badges
- Buttons
- All buttons
- Choosing buttons
- 高強調
- Extended FAB
- FAB
- Filled button
- 中強調
- Filled tonal button
- Elevated button
- Outlined button
- 低強調
- Text button
- Segmented button
- Icon button
- 高強調
- Herarchy
- Primary action button
- Other buttons
- Placement
- Choosing buttons
- Common buttons
- Overview／Specs／Guidelines／
- Accessibility
各成分のウェイト）R（赤）: 0.2126、G（緑）: 0.7152、B（青）: 0.0722
Luminance=0.2126×R+0.7152×G+0.0722×B
- FAB
- Extended FAB
- Icon buttons
- Segmented buttons
- All buttons
- Cards
- Overview／Specs／
- Guidelines
- mozaic grid、staggered grid
- ／Accessibility
- Carousel
- Checkbox
- Chips
- Date pickers
- Dialogs
- Divider
- Lists
- Menus
- Navigation ※同じ画面上で以下を同時に使用してはいけない
- Navigation bar(コンパクトなウィンドウ サイズ)
- Navigation rail(中サイズおよび拡張ウィンドウ サイズ)
※画面の左側に固定されていて、重要な目的地を表示します。- Overview／Specs／Guidelines／Accessibility
1. FAB装備可能
2. 目的地は(色ではなく)アクティブインジケータ
3. 目的地は3～7個
4. 単一目的地および2次目的地は不可
5. タブと併用は可能
6. logo表示可能
- Overview／Specs／Guidelines／Accessibility
- Navigation drawer(拡張、大、特大ウィンドウ サイズ)
※スライドして現れるメニューで、二次的な目的地やアクションを提供します。- Overview／Specs／Guidelines／Accessibility
1. 標準(拡大、大、特大のウィンドウ サイズ)
・常に表示時：
宛先を頻繁に切り替える場合に最適
・メニュー アイコンをタップして開閉時：
画面のコンテンツに重点を置く場合に最適
2. モーダル(中サイズおよびコンパクト サイズ)
※スクリムにより他のコンテンツをブロック可能
- Overview／Specs／Guidelines／Accessibility
- Progress indicators
- Radio button
- Search
- Sheets
- Bottom sheets
- Side sheets
- Sliders
- Snackbar
- Switch
- Tabs
- Text fields
- Time pickers
- Tooltips
２-７．Blog
３．本説明
上記URL(docs.flutter.dev/../large-screens)の本説明です。