【Flutter】右だけに色を付けるDropdownスタイル

file

画像みたいに右のとこだけ色を付けるのをやってみました。
グラデーションを利用しています。

右だけ色を変えるサンプル

DecoratedBox(
decoration: BoxDecoration(
  border: Border.all(color: Colors.black38),
  gradient: const LinearGradient(stops: [
    0,
    0.88,
    0.88,
    1
  ], colors: [
    Colors.white,
    Colors.white,
    Color(0xFFE75482),
    Color(0xFFE75482)
    //add more colors
  ]),
  borderRadius: BorderRadius.circular(5),
  // boxShadow: const <BoxShadow>[
  //   BoxShadow(
  //       color: Color.fromRGBO(0, 0, 0, 0.57), //shadow for button
  //       blurRadius: 5) //blur radius of shadow
  // ],
),
child: Padding(
  padding: const EdgeInsets.only(left: 30, right: 10),
  child: DropdownButton(
    value: "menuone",
    items: const [
      DropdownMenuItem(
        value: "menuone",
        child: Text("Menu One"),
      )
    ],
    onChanged: (value) {},
    isExpanded: true, //make true to take width of parent widget
    underline: Container(), //empty line
    style: const TextStyle(fontSize: 18, color: Colors.black),
    // dropdownColor: Colors.green,

    icon: Icon(Icons.keyboard_arrow_down_rounded),

    iconEnabledColor: Colors.white, //Icon color
  ),
),
);

参考
https://www.flutterclutter.dev/flutter/tutorials/how-to-add-a-border-to-a-widget/2020/587/