草庐IT

dart - Flutter 底板圆角半径

coder 2023-07-23 原文

我正在编写一个应用程序，它需要一个带有圆角半径的 Bottom Sheet 。您可以在 Google Task 应用中看到类似内容。

这是我的代码

showModalBottomSheet(
        context: context,
        builder: (builder) {
          return new Container(
            height: 350.0,
            color: Colors.transparent,
            child: new Container(
                decoration: new BoxDecoration(
                    color: Colors.white,
                    borderRadius: new BorderRadius.only(
                        topLeft: const Radius.circular(10.0), topRight: const Radius.circular(10.0))),
                child: new Center(
                  child: new Text("This is a modal sheet"),
                )),
          );
        });

仍然显示没有边框半径的工作表。

好吧，我找到了一个理由。它确实显示了圆角，但由于脚手架背景颜色，容器的背景保持白色。 现在的问题是如何覆盖脚手架背景颜色。

最佳答案

对于那些仍在努力解决这个问题的人:

由于某些原因 Colors.transparent 不起作用，所以您需要做的就是将颜色更改为:Color(0xFF737373)

showModalBottomSheet(
        context: context,
        builder: (builder) {
          return new Container(
            height: 350.0,
            color: Color(0xFF737373),
            child: new Container(
                decoration: new BoxDecoration(
                    color: Colors.white,
                    borderRadius: new BorderRadius.only(
                        topLeft: const Radius.circular(10.0), topRight: const Radius.circular(10.0))),
                child: new Center(
                  child: new Text("This is a modal sheet"),
                )),
          );
        });

关于dart - Flutter 底板圆角半径，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52347349/

Flutterdartsectionnewcodematerial-designbottom-sheet

有关dart - Flutter 底板圆角半径的更多相关文章

  1. Flutter 环境变量配置和flutter doctor中的错误解决 - 2

    一、环境变量右键点击我的电脑-属性：然后找到环境变量 1.Android的SDK不在C盘的话需要额外配这个到用户环境变量：ANDROID_HOMED:\AndroidSDK2.然后在系统变量：Path中添加一条这样的值        D:\Flutter\flutter\bin             这个值写flutter包解压的实际地址即可 3.在系统变量中添加两个镜像变量：        变量名：FLUTTER_STORAGE_BASE_URL      变量值：https://storage.flutter-io.cn        变量名：PUB_HOSTED_URL      变量

  2. javascript - Google Dart JavaScript 转换器是否支持旧版浏览器？ - 2

    GoogleDartJavaScript转换器支持旧版浏览器还是仅支持现代浏览器？ 最佳答案 根据technicaloverviewofitsofficialsite:您将能够以多种方式运行Dart代码:1.将Dart代码转换为可在任何现代浏览器中运行的JavaScript:Chrome、Safari5+和Firefox4+(即将推出更多浏览器支持)。2.在服务器端直接在虚拟机中执行Dart代码3.使用Dartboard在任何浏览器窗口中编写、修改和执行小型Dart程序Dart->JavaScript编译器几乎不可能支持旧版浏览器。

  3. javascript - 用 Dart 可视化？ - 2

    我的工作涉及大量的可视化。我一直在用D3.js和JavaScriptInfovistoolkit我最近了解到Dart如何成为开发Web应用程序的新方法。Q1。Dart是否提供任何用于可视化的库(某种级别的D3.js或JavaScriptInfovistoolkit)？Q2。如果我继续使用Dart，我可以使用D3.js吗？/JavascriptInfovistoolkit与Dart一起？编辑:我在互联网上发现wecanuseJavascriptalongwithDart.我经历了DartFAQ，但无法真正找到与可视化库或D3.js本身相关的任何内容。 最佳答案

  4. javascript - Dart vs JavaScript——它们是编译语言还是解释语言？ - 2

    Dart被认为是编译语言还是解释语言？同样的问题也适用于JavaScript。问题原因:我去过watchinganinterview与dart的创始人一起，在7:10LarsBak说:"Whenyou[...]inaJavaScriptprogram,youactuallyexecuteJavaScriptbeforeyoustartrunningtherealprogram.InDart,youdon'texecuteanythingbeforethefirstinstructioninmainisbeingexecuted".在我看来，他是在说JavaScript是一种编译型语言，

  5. javascript - d3 在给定半径内为气泡图设置动画 - 2

    //气泡图基础。http://jsfiddle.net/NYEaX/1450/我正在尝试为气泡设置动画-通过改变它们的比例-如果可能的话，它们会淡入淡出。在某个阶段，我需要用某种重力将它们聚集在一起，以占据更多的包容圆周。(function(){vardiameter=250;varsvg=d3.select('#graph').append('svg').attr('width',diameter).attr('height',diameter);varbubble=d3.layout.pack().size([diameter,diameter]).value(function(d

  6. javascript - Chrome 在具有边框半径的缩放元素内搞乱图像 - 2

    用例我正在尝试构建“幻灯片放映”类型的应用程序。每张幻灯片都有固定的宽高比，但我希望内容以其正常的宽度/高度呈现-所以我试图在幻灯片的内容上使用CSS3“transform:scale”，使用视口(viewport)宽度/高度我计算理想的比例/边距以使幻灯片适合视口(viewport)。在一张特定的幻灯片上，我为人们展示了一些“信息卡”和每个人的“继任者”列表问题Chrome在图像上显示出一些非常奇怪的行为。如果您调整窗口大小，图像会到处移动。如果您强制图像以某种方式重新绘制图像似乎会自行修复(即向下滚动页面并返回)编辑这似乎与边框半径框内的图像特别相关!问题这是Chrome中的错误吗

  7. javascript - Dart js-interop 与 jquery ui - 2

    我是Dart的新手，我在开始使用js-interop库时遇到了问题。我想从jqueryui添加一个slider到我的页面，但我不知道如何从Dart进行slider()设置调用。js-interop是这样做的正确方法吗？对此提供一些帮助将不胜感激。voidmain(){js.scoped((){varslider=query('#slider-range');varoptions=js.map({'range':true,'values':[17,67]});//Thisdoesn'twork.Elementhasnomethodnamedslider.slider.slider(opt

  8. javascript - CSS3 边框半径到 HTML5 Canvas - 2

    我试图在Canvas中重现CSS3边框半径。绘制圆Angular矩形很容易，但在CSS中，每个边框的值可能很高。例如:HTMLCSSdiv{height:50px;width:50px;position:absolute;top:10px;}.normal_radius{border:1pxsolidblack;border-radius:5px5px10px15px;left:10px;}.high_radius{border:1pxsolidred;border-radius:5000px500px100px150px;left:80px;}.high2_radius{border

  9. javascript - 处理 DART 中的事件 - 2

    我是DART的新手。我阅读了语言概述并在DART编辑器中检查了示例代码。到目前为止，我找不到如何处理DART中的事件。例如onclick="call_dart_method()".我们如何处理DART中的事件？ 最佳答案 这不是你在Dart上的做法在此处查看“事件”部分下的内容:http://www.dartlang.org/articles/improving-the-dom/elem.onClick.listen((event)=>print('click!')); 关于javasc

  10. javascript - 谷歌地图中的交互式圆圈随半径变化而变化 - 2

    我想要一个用于谷歌地图的交互式圆圈，当我在slider中更改半径时它会增加或减少。当我增加半径时它工作正常，但在减小半径时它不会改变(减小)map中的圆$(function(){$("#slide").slider({orientation:"horizontal",range:"min",max:10000,min:500,value:500,slide:function(event,ui){drawCircle(ui.value);}});});functiondrawCircle(rad){circle=newgoogle.maps.Circle({strokeColor:"#F

随机推荐