贝塞尔曲线
class BottomClipper extends CustomClipper{//切割类继承
@override
Path getClip(Size size) {//必备属性一
var path = Path();
path.lineTo(0, 0);
path.lineTo(0, size.height-60);
var frit = Offset(size.width/2,size.height);
var frit2 = Offset(size.width,size.height-60);
path.quadraticBezierTo(frit.dx, frit.dy, frit2.dx, frit2.dy);//二次贝塞尔曲线
path.lineTo(size.width, size.height-60);
path.lineTo(size.width, 0);
return path;
}
@override
bool shouldReclip(CustomClipper oldClipper) {//必备属性二
// TODO: implement shouldReclip
return false;
}
}
调用方法
ClipPath(
clipper: BottomClipper(),
child: Container(),
)
底部弹窗
底部弹起
showModalBottomSheet(
context: context,
builder:(BuildContext context){
return TabMyApp();//返回的是一个容器
}
);
下拉框
DropdownButtonHideUnderline(
child:new DropdownButton(
hint: new Text(''),//第一次把hint展示位下拉菜单条目的第一个值（默认值）
//设置这个value之后,选中对应位置的item，
//再次呼出下拉菜单，会自动定位item位置在当前按钮显示的位置处
value: selectItemValue,//下拉菜单选择完之后,呈现给用的值
items: generateItemList(),//下拉菜单item点击之后的回调
iconSize: 24.0,
isDense: true,
onChanged: (T){
setState(() {
selectItemValue=T;
});
}
),
),
回调函数
var selectItemValue;
var selectItemValue1;
/*DropDownState(){
selectItemValue=getDropdownMenuItem()[0].value;
}*/
List generateItemList() {
List items = new List();
for(int i =0;i<100;i++){
DropdownMenuItem itemi = new DropdownMenuItem(
value: i.toString(), child: new Text(i.toString())
);
items.add(itemi);
}
return items;
}
展开闭合控件
ExpansionTile
const ExpansionTile({
Key key,
this.leading,
@required this.title,//开关的名称
this.backgroundColor,//展开背景色
this.onExpansionChanged,
this.children = const [],
this.trailing,
this.initiallyExpanded = false,//默认关闭
}) : assert(initiallyExpanded != null),
super(key: key);
输入框
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.min,
children: [
Container(
constraints: BoxConstraints.tightFor( width: 200.0),
child: TextField(
autofocus: false,
//maxLength: 8,
textAlign: TextAlign.right,//右对齐
keyboardType: TextInputType.number,//数字键盘
onChanged: (v) {
setState(() {
price = double.parse('$v');
});
//记录金额
print("onChange: $v");
},
decoration: InputDecoration(
border: InputBorder.none,//去掉输入框的下滑线
hintText: "0.00",
hintStyle: TextStyle( fontSize: 14.0)
),
),
),
Text(' 元 ',style: TextStyle(color: Colors.black),),
],
),
],
),
弹出框加叠加（一个红包的样子）
showDialog(//调用方法
context: context, //BuildContext对象
barrierDismissible: false,
builder: (BuildContext context) {
return new LoadingDialog( //调用对话框
text: '滚烫',
ponto: "https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3463668003,3398677327&fm=58"
);
});
//弹出的内容
class LoadingDialog extends Dialog {
String text;//传递的名字
String ponto;//头像地址
LoadingDialog({Key key, @required this.text,this.ponto}) : super(key: key);
@override
Widget build(BuildContext context) {
var stack = new Stack(//创建折叠层
alignment: const FractionalOffset(0.5, 0.935),//相对坐标
children: [
//底层
new Material( //创建透明层
type: MaterialType.transparency, //透明类型
child: new Center( //保证控件居中效果
child: new SizedBox(
width: 260.0,
height: 420.0,
child: new Container(
decoration: ShapeDecoration(
color: Colors.red,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0),
),
),
),
child: new Column(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
//new CircularProgressIndicator(),
ClipPath(
clipper: BottomClipper(),
child: Container(
height: 360,
width: 300,
//color:
decoration: ShapeDecoration(
color: Colors.red[600],
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
Radius.circular(8.0),
),
),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.network(
ponto,
scale: 3.0,
),
SizedBox(
height: 10,
),
Text(text,style: new TextStyle(fontSize: 16.0,color: Colors.orangeAccent)),
Text('恭喜发财，大吉大利',style: new TextStyle(fontSize: 24.0,color: Colors.orangeAccent)),
SizedBox(
height: 100,
),
],
),
),
),
],
),
),
),
),
),
//折叠层
Container(
height: 200,
child:Column(
children: [
Container(
height: 70,
width: 70,
child: FlatButton(
onPressed: (){
Navigator.push( context,
new MaterialPageRoute(builder: (context) {
return Hongbaoxiangqing();
})).then((String){//回调函数
Navigator.pop(context);
});
},
child: Text('開',style: TextStyle(fontSize: 30),),
),
decoration: BoxDecoration( //背景装饰
color: Colors.amber[200],
borderRadius: BorderRadius.circular(35),
),
),
SizedBox(
height: 70,
),
FlatButton(
onPressed: (){
Navigator.pop(context);
},
child:Icon(
Icons.clear,color: Colors.red[800],
)
)
],
),
),
],
);
return stack;
}
}
//美化界面
class BottomClipper extends CustomClipper{//切割类继承
@override
Path getClip(Size size) {//必备属性一
var path = Path();
path.lineTo(0, 0);
path.lineTo(0, size.height-60);
var frit = Offset(size.width/2,size.height);
var frit2 = Offset(size.width,size.height-60);
path.quadraticBezierTo(frit.dx, frit.dy, frit2.dx, frit2.dy);//二次贝塞尔曲线
path.lineTo(size.width, size.height-60);
path.lineTo(size.width, 0);
return path;
}
@override
bool shouldReclip(CustomClipper oldClipper) {//必备属性二
// TODO: implement shouldReclip
return false;
}
}
