Flutter:如何创建透明的窗口小部件类?

时间:2018-06-07 23:30:50

标签: dart flutter

我想创建一个容器大小为250x500的新窗口小部件类,其余的类/窗口小部件为0.5不透明度 - 允许先前的窗口小部件 - 我们从中启动 - 部分可见。

这可能吗?如果是这样的话?

-Thanks

以下是我正在调用的有状态类

class ShowMyTitles extends StatefulWidget {
  @override
  _ShowMyTitlesState createState() => _ShowMyTitlesState();
}

class _ShowMyTitlesState extends State<ShowMyTitles> {


  List<Map<String, bool>> myListOfMapTitles;
  Map<String, bool> valuesHeaders;
  int trueCount = 0;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    SettingsForMap SFM = new SettingsForMap();
    myListOfMapTitles = SFM.myListOfMapTitles;
    valuesHeaders = SFM.valuesHeaders;
  }


  @override
  Widget build(BuildContext context) {

    List myTitles = [];

    return new WillPopScope(
      onWillPop: (){
        myListOfMapTitles.forEach((valuesAll) {
          valuesAll.forEach((s,b){
            if(b == true) {
              myTitles.add(s);
              print('My Selecteed titles are = ' + s.toString());
            }
          });

        });
        Navigator.pop(context, myTitles);

      },
      child: new Container(
        child: new GestureDetector(
          onTap: (){
            myListOfMapTitles.forEach((valuesAll) {
              valuesAll.forEach((s,b){
                if(b == true) {
                  myTitles.add(s);
                  print('My Selecteed titles are = ' + s.toString());
                }
              });

            });
            Navigator.pop(context, myTitles);
          },
          child: _titlesDialog(context, 'Select 2 Titles (Max)'),
        ),
      ),
    );
  }

3 个答案:

答案 0 :(得分:4)

有一个Opacity小部件。将您想要透明的小部件包裹在其中。

Opacity(child:MyTransparentWidget(),opacity:0.45)

答案 1 :(得分:0)

您可以使用Stack小部件。

使用 DECLARE @return_value Int EXEC @return_value = [dbo].[spCodeMeans] @StudyID = 22 SELECT @return_value as 'Return Value' GO 小部件围绕widget which you want to change the opacitycontainer

然后使用 Stack 小部件包装widget which you want to change the opacity并提及所需的不透明度。

确保将容器放在Opacity之后,然后只将它放在透明小部件上方

答案 2 :(得分:0)

要使任何小部件透明,请将该小部件设为父Theme()小部件的子级。例如

class TransparentWidget extends StatelessWidget {

 @override Widget build(BuildContext context) {
   return Theme(
      data: Theme.of(context).copyWith(
       // Set the transparency here
       canvasColor: Colors.white70, //or any other color you want. e.g Colors.blue.withOpacity(0.5)
      ),
      child: Container(
          height: 250.0,
          width: 250.0,
          child: Text("Hello World")
       )
    );
  }
}

OR

只需将主容器的背景装饰设为不透明的颜色即可。

 Container(
    decoration: BoxDecoration(
        color: Colors.white.withOpacity(0.7),
     )
 );