[英]Android Dialog with rounded corners - still showing the background without corners radius
[英]square dialog with radius in corners in flutter
我嘗試了這個並使對話框顏色透明在它們的容器中處於中心,但我找不到如何使容器角的半徑
Dialog alert = Dialog(
elevation: 0,
backgroundColor: Colors.greenAccent,
//backgroundColor: hexToColor('#f26937'),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
),
//title: Text("My title"),
child:
ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(1.0)),
child:Container(
margin: EdgeInsets.only(right: width-54-232,left: width-54-232),
color: hexToColor('#f26937'),
height: 120,
width: 120,
child : Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SizedBox(
child: CircularProgressIndicator(
//backgroundColor: Colors.white,
valueColor: new AlwaysStoppedAnimation<Color>(Colors.white),
),
height: 54.0,
width: 54.0,
)
],)
),)
您可以在下面復制粘貼運行完整代碼
您可以使用BoxDecoration
工作演示
代碼片段
Container(
decoration: BoxDecoration(
color: hexToColor('#f26937'),
borderRadius: BorderRadius.all(
Radius.circular(20.0),
)
),
完整代碼
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
Color myColor = Color(0xff00bfa5);
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: "Rounde Alert Box",
home: Scaffold(
appBar: AppBar(
backgroundColor: myColor,
title: Text("Rounded Alert Box"),
),
body: RoundedAlertBox(),
),
);
}
}
class RoundedAlertBox extends StatefulWidget {
@override
_RoundedAlertBoxState createState() => _RoundedAlertBoxState();
}
class _RoundedAlertBoxState extends State<RoundedAlertBox> {
@override
Widget build(BuildContext context) {
return Center(
child: RaisedButton(
onPressed: openAlertBox,
color: myColor,
child: Text(
"Open Alert Box",
style: TextStyle(color: Colors.white),
),
),
);
}
Color hexToColor(String hexColor) {
final hexCode = hexColor.replaceAll('#', '');
return Color(int.parse('FF$hexCode', radix: 16));
}
openAlertBox() {
return showDialog(
context: context,
builder: (BuildContext context) {
return Dialog(
elevation: 0,
backgroundColor: Colors.greenAccent,
//backgroundColor: hexToColor('#f26937'),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(8.0)),
),
//title: Text("My title"),
child: Container(
decoration: BoxDecoration(
color: hexToColor('#f26937'),
borderRadius: BorderRadius.all(
Radius.circular(20.0),
)
),
margin: EdgeInsets.only(right: 10, left: 10),
height: 120,
width: 120,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SizedBox(
child: CircularProgressIndicator(
//backgroundColor: Colors.white,
valueColor:
new AlwaysStoppedAnimation<Color>(Colors.white),
),
height: 54.0,
width: 54.0,
)
],
)));
});
}
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.