FlutterでRaisedButtonの影を設定する方法


  1. デフォルトの影を使用する方法:

RaisedButtonウィジェットは、デフォルトで影を持っています。したがって、特別な設定を行わなくても、デフォルトの影が表示されます。以下は、RaisedButtonの基本的な使用例です。

RaisedButton(
  onPressed: () {
    // ボタンが押された時の処理
  },
  child: Text('ボタン'),
)
  1. カスタムの影を使用する方法:

RaisedButtonウィジェットの影をカスタマイズするには、elevationプロパティを使用します。elevationプロパティは、ボタンの影の高さを設定します。以下は、elevationプロパティを使用して影をカスタマイズする例です。

RaisedButton(
  onPressed: () {
    // ボタンが押された時の処理
  },
  child: Text('ボタン'),
  elevation: 8, // 影の高さを設定
)
  1. 影の色を変更する方法:

RaisedButtonの影の色を変更するには、shadowColorプロパティを使用します。shadowColorプロパティは、Colorクラスのインスタンスを受け取り、影の色を設定します。以下は、shadowColorプロパティを使用して影の色を変更する例です。

RaisedButton(
  onPressed: () {
    // ボタンが押された時の処理
  },
  child: Text('ボタン'),
  elevation: 8,
  shadowColor: Colors.red, // 影の色を赤に設定
)