HIDI Flutter Challenge (7) AppBar Widget


AppBar Widget


> AppBar Widget

  • アプリケーションバーを設計するコンポーネント
  • SliverAppBar:AppBarを使用してカスタムスクロールビューを提供する柔軟なアプリケーションBar
  • システムUIの侵入を防ぐために、周囲のMediaQueryの入力に従ってコンテンツを挿入してください.

  • >> Implementation

    AppBar({ Key? key, this.leading, this.automaticallyImplyLeading = true, this.title, this.actions, this.flexibleSpace, this.bottom, this.elevation, this.shadowColor, this.shape, this.backgroundColor, this.foregroundColor, this.brightness, this.iconTheme, this.actionsIconTheme, this.textTheme, this.primary = true, this.centerTitle, this.excludeHeaderSemantics = false, this.titleSpacing, this.toolbarOpacity = 1.0, this.bottomOpacity = 1.0, this.toolbarHeight, this.leadingWidth, this.backwardsCompatibility, this.toolbarTextStyle, this.titleTextStyle, this.systemOverlayStyle, }) : assert(automaticallyImplyLeading != null), assert(elevation == null || elevation >= 0.0), assert(primary != null), assert(toolbarOpacity != null), assert(bottomOpacity != null), preferredSize = Size.fromHeight(toolbarHeight ?? kToolbarHeight + (bottom?.preferredSize.height ?? 0.0)), super(key: key);

    >>AppBarプライマリプロパティ

  • actions:タイトルコンポーネントの後に行に表示するコンポーネントのリスト=>final List? actions;
  • は通常iconButtonからなる
  • leading:ツールバーのタイトルの前に表示されるコンポーネント
    => final Widget? leading;
    1.通常、iconまたはiconButtonからなる.
    2.ナビゲーションの主要コンポーネントとなる.
  • title:アプリケーションセットに表示される基本部品
    => final Widget? title;
  • bottom:アプリケーションバーの下部を表示
    => final PreferredSizeWidget? bottom;
    1.一般的にラベルバーとして使用
    2.優先的なSizeWidgetを実装するコンポーネントにのみ適用されます.
  • 背景色:appbarの背景色
    => final Color? backgroundColor;
  • 標高:アプリケーションバーの下のシャドウのサイズを制御する
    => final double? elevation;