質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

Q&A

1回答

2047閲覧

[flutter]下のナビゲーションの境界線を影にしたい

mayo_

総合スコア2

Flutter

Flutterは、iOSとAndroidのアプリを同じコードで開発するためのフレームワークです。オープンソースで開発言語はDart。双方のプラットフォームにおける高度な実行パフォーマンスと開発効率を提供することを目的としています。

Dart

Dartは、Googleによって開発されたJavaScriptの代替となることを目的に作られた、ウェブ向けのプログラミング言語である。

0グッド

0クリップ

投稿2021/11/26 06:46

前提・実現したいこと

BottomNavigationBar の境界線を影にしたい

試したこと

AppBarなどに使用されている

Dart

1elevation: 5.0, 2shadowColor: Colors.white.withOpacity(0.5),

などを使用しようとしましたが、うまく機能しませんでした

補足情報(FW/ツールのバージョンなど)

イメージ説明

上記の画像は上のNavigationなのですが、このような形で境界線を影にしたいです

まだFlutterを始めたばかりで分からないことが多いため、ご教示いただきたく思います
よろしくお願いいたします

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

こちらで試したところ、elevationプロパティは正常に動作しています。
また、shadowColorというプロパティはないので、そこでエラーが起きると思います。

影を自由につけたいという場合は、Containerでラップして装飾しましょう。

Dart

1bottomNavigationBar: Container( 2 decoration: BoxDecoration( 3 boxShadow: <BoxShadow>[ 4 BoxShadow( 5 color: Colors.black54, 6 blurRadius: 15.0, 7 offset: Offset(0.0, 0.75) 8 ) 9 ], 10 ), 11 child: BottomNavigationBar( 12 // 省略 13 ), 14),

参考:no have shadow in bottom navigation bar · Issue #62850 · flutter/flutter

投稿2021/12/01 01:28

Yasha_Wedyue

総合スコア830

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問