如何在flutter中显示一个圆圈的边框颜色？
在Flutter中显示一个圆圈的边框颜色可以通过使用Container组件和装饰器（Decoration）来实现。以下是一个完善且全面的答案：
要在Flutter中显示一个圆圈的边框颜色，可以按照以下步骤进行操作：
- 导入Flutter的相关库：
import 'package:flutter/material.dart';- 创建一个StatelessWidget或StatefulWidget：
class CircleBorderWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Container(
width: 100, // 设置容器的宽度
height: 100, // 设置容器的高度
decoration: BoxDecoration(
shape: BoxShape.circle, // 设置形状为圆形
border: Border.all(
color: Colors.red, // 设置边框颜色为红色
width: 2, // 设置边框宽度为2
),
),
);
}
}- 在主函数中使用CircleBorderWidget：
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Circle Border Example'),
),
body: Center(
child: CircleBorderWidget(), // 使用CircleBorderWidget
),
),
);
}
}这样就可以在Flutter中显示一个具有红色边框的圆圈了。你可以根据需要调整容器的宽度、高度、边框颜色和宽度来实现不同的效果。
推荐的腾讯云相关产品：腾讯云移动开发平台（https://cloud.tencent.com/product/mwp）提供了丰富的移动开发解决方案，可帮助开发者快速构建高质量的移动应用。
相关·内容
3回答
一个圆圈中的多个按钮/文本
flutter、flutter-layout、flutter-widget
我想在颤音中创造一个圆圈。我想要添加多个按钮，并将它们绑定成这样的圆圈。
标记的字段应该是按钮，而课程1只是文本。我可以创建这样的东西，但它只是字符串分裂在按钮。
这是我的密码。我不知道怎么做这件事。我是新来的。
import 'package:flutter/material.dart';
void main(){runApp(MyApp());}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Sc
浏览 6提问于2019-12-04得票数 6
回答已采纳
1回答
ListView中的颤振边框更改将项目移动到下面
flutter、dart、flutter-layout、flutter-animation
我在简单容器中使用ListView，当您在列表视图中按下容器时，它会改变选定的容器宽度和边框颜色，但是当发生这种情况时，它也会将其他容器移动到下面。我想要得到的是，当您选择项目时，更改边框的宽度和颜色，不要移动列表中的项目以及容器中的项目。
请用下面的代码来重现问题，谢谢！
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext
浏览 0提问于2019-12-06得票数 1
回答已采纳
3回答
增加高度后不能做大尺寸的容器
flutter、dart、containers、scaffold
这是我的代码，在这里，我增加了这个容器的高度，在移动仿真器中形成了一个大圆圈，但无法实现。我不知道这背后的原因。
import 'package:flutter/material.dart';
void main () {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({ Key? key }) : super(key: key);
@override
Widget build(BuildContext context) {
return con
浏览 2提问于2022-02-20得票数 1
1回答
如何在不影响其他项目的情况下展开列表项。(颤振)
flutter、web、stack、row
我想要创建Netflix主页，在创建这种悬停状态时，我被困住了。
我创建了两个基本部件。一个用于数字加上缩略图，另一个用于小部件悬停时的扩展视图。然后，我将它们放入带有Inkwell的Inkwell中，其中onHover更改状态以显示扩展的小部件。
当我在小部件上悬停时，它确实在正常状态和扩展状态之间切换，当我试图将这些小部件的列表放在一起时，问题就出现了。
在使用row (或ListView)将它们放在一起时，在悬停后，扩展的小部件使其他小部件移动。(这不是通缉的行为，我希望它们重叠)
当我在stack中使用它时，小部件确实重叠，但是现在它不再可以滚动了。
我增
浏览 2提问于2022-03-27得票数 0
1回答
容器内构件的颤振相对位置
flutter、dart
我有以下略为修改的standart应用程序，其中按钮和结果放在一个容器中。
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
浏览 2提问于2020-06-19得票数 1
回答已采纳
2回答
颤振:使用中心小部件覆盖最小宽度
flutter、dart
我想把一些文字放在容器里。容器具有min/maxWidth约束。但是，当我用Center包装文本时，无论文本的长度如何，容器的宽度都会达到最大值。当文本较少/没有文本时，容器宽度不会缩小到最小大小。
这是代码
import 'package:flutter/material.dart';
import './constants.dart';
void main() {
runApp(ProviderScope(child: MyApp()));
}
class MyApp extends StatelessWidget {
@override
W
浏览 7提问于2020-12-22得票数 3
回答已采纳
1回答
Flutter :更改appbar上的文本位置
android、flutter、dart、flutter-layout
如何更改我的文本"Sito Web“在appbar右侧的位置？我试着用 alignment: Alignment.TopRight 但他将右上角的文本移到了appbar的下方。在这里，我的意思是https://ibb.co/X28TzNN的屏幕改变了"Sito Web“的位置在红色圆圈的位置。这就是代码，我也尝试过这个方法，但是不能在appbar中移动。这里的文件包含appbar background_image_task-9.dart import 'package:flutter/material.dart';
class BackgroundImage
浏览 33提问于2019-12-06得票数 2
回答已采纳
3回答
如何在行中对齐文本小工具？
flutter、dart
如何在中心位置显示hello world？ ? 复制-粘贴代码： import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:get/get_navigation/src/root/get_material_app.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget bu
浏览 108提问于2021-11-17得票数 1
回答已采纳
1回答
无法将行下拉到下
flutter
我正在尝试将行拉到横轴的末端(到屏幕的底部)。
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
import 'package:provider/provider.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@overr
浏览 15提问于2019-07-17得票数 0
回答已采纳
2回答
导致错误的相关小部件是容器lib\screens\home_screen.dart:18。
android、flutter、dart
无法逐行放置水平列表视图。我想要这样的..。
下面是我的代码(我有saperate文件中的搜索栏小部件，运行良好，我还没有类别itmes svgs，所以只使用文本作为子文件)下面是我的代码：
class CategoriesListView extends StatelessWidget {
CategoriesListView({Key? key}) : super(key: key);
final List<String> _categories = ['Fruits', 'Vegetables', 'Fishes'
浏览 3提问于2021-12-27得票数 0
2回答
有没有办法让容器的宽度在抖动时大于屏幕？
flutter、dart
我有一个下面的容器，它实际上比屏幕大。但似乎flutter不允许容器宽度大于屏幕。 import 'package:flutter/material.dart';
import 'dart:math' as math;
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutt
浏览 14提问于2020-12-11得票数 0
2回答
集装箱中心的颤振变换尺度
dart、flutter
我试图创建一个翻转效果，但在开始动画之前，我试图使变换停留在容器的中心。
但是，即使使用FractionalOffset(0.5, 0.5)或Center()包装，Transform()结果仍然位于Container的顶部，如下图所示。
你能帮我把它放在集装箱的中间吗？
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildConte
浏览 15提问于2017-07-09得票数 8
回答已采纳
2回答
无法在集装箱上定位图像
flutter
我只是不知道我做错了什么。这样做的目的是将网络映像堆叠在AppBar下面的容器上。麻烦的是，图像似乎是被裁剪或剪裁的，或者当我尝试定位它时，您可能会想要放置它。同样的代码如下：
屏幕截图
main.dart
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return MaterialApp(
debugShow
浏览 4提问于2022-01-19得票数 0
回答已采纳
1回答
容器内的墨水/图标颜色
flutter
我在墨水中有一个IconButton (给它一个边框)，它在容器内。然而，边界是不可见的，因为它是由容器的颜色覆盖。
在容器中显示带有彩色背景的IconButton的最佳方法是什么？
工作实例：
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
浏览 1提问于2020-01-06得票数 2
回答已采纳
3回答
我不能点击Appbar中的按钮
flutter、dart
我已经创建了一个包含buttons.The的自定义应用程序条，问题是我不能单击这些按钮。我已经用输出检查了按钮，但没有发生。
main.dart
class MyApp extends StatelessWidget {
const MyApp({super.key});
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo'
浏览 5提问于2022-11-14得票数 0
3回答
颤振，材料，移除DrawerHeader下的微弱线
flutter
DrawerHeader小部件在DrawerHeader小部件下面产生一条微弱的线。我怎么才能把这个移除？我已经尝试了装饰选项，到目前为止我发现的唯一方法是从DrawerHeader切换到自定义小部件，如果可能的话，我想避免这种情况。
下面是Flutter.dev指南中的代码，DrawerHeader颜色设置为白色，因此这一行是可见的。
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
浏览 17提问于2022-02-23得票数 2
1回答
为什么我会在scaffold的背景中看到一个巨大的灰色圆圈？
flutter、dart、flutter-layout
我有一个PayBills()小部件screen =，它有两个选项卡，每个选项卡显示一个我指定的单独的选项卡dart文件，但是我在第一个dart文件的背景中看到一个巨大的灰色圆圈，在第二个选项卡中什么也没有得到，但是我不知道问题出在哪里。 ? ? PayBills()小部件屏幕代码： import 'package:flutter/material.dart';
import '../../constans/constants.dart';
import 'first_tab.dart';
import 'second_tab
浏览 7提问于2020-10-16得票数 1
回答已采纳
5回答
容器装饰在列或行中不可见
dart、flutter、flutter-layout
我是flutter的新手，我想要在顶部显示全宽的图像，在AppBar我从堆栈溢出中获得代码后，它工作得很好，如果我将容器放入Scaffold的主体中，它将显示沿屏幕的全宽图像，但当我将此代码放入列或行中时，它是不可见的。 我尝试在Image()类中显示图像，但它不会根据屏幕大小进行调整。我的意思是它没有反应。 import 'package:flutter/material.dart';
class SecondRoute extends StatelessWidget {
@override
Widget build(BuildContext context) {
浏览 71提问于2019-01-23得票数 0
回答已采纳
2回答
在颤振中移除背景边框
flutter、border、circular-dependency
我很困惑如何切断彩色边框，当我遇到单词“月份”时，我试着用BoxDecoration(颜色: Colors.transparent)，但是它没有产生任何结果，边框仍然没有被切割。
如下所示：
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
@override
State<MyApp> c
浏览 8提问于2022-09-19得票数 0
10回答
颤振-屏幕没有滚动
dart、flutter
我插入了6张卡片，但是不可能滚动屏幕。
根据下面的图像，页脚上会出现一条红色条纹，而屏幕不会滚动。
怎样才能滚动屏幕呢？
main.dart
import 'package:flutter/material.dart';
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: "Myapp
浏览 12提问于2017-06-14得票数 39
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
活动推荐
腾讯云开发者
