mirror of
https://github.com/alibaba/flutter-go.git
synced 2025-07-15 03:04:25 +08:00
add(CupertinoSegmentedControl demo && CupertinoSlider demo)
add(CupertinoSegmentedControl demo && CupertinoSlider demo)
This commit is contained in:
@ -0,0 +1,42 @@
|
|||||||
|
/**
|
||||||
|
* Created with Android Studio.
|
||||||
|
* User: 三帆
|
||||||
|
* Date: 15/01/2019
|
||||||
|
* Time: 22:23
|
||||||
|
* email: sanfan.hx@alibaba-inc.com
|
||||||
|
* tartget: xxx
|
||||||
|
*/
|
||||||
|
import 'package:flutter/cupertino.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class CupertinoSegmentedControlDemo extends StatefulWidget {
|
||||||
|
_Demo createState() => _Demo();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _Demo extends State<CupertinoSegmentedControlDemo> {
|
||||||
|
String value = 'a';
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return new CupertinoSegmentedControl(
|
||||||
|
onValueChanged: (v) {
|
||||||
|
this.setState(() {
|
||||||
|
value = v;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
pressedColor: Color(0xff7c1c25),
|
||||||
|
borderColor: Color(0xffac172a),
|
||||||
|
selectedColor: Color(0xffac172a),
|
||||||
|
groupValue: value,
|
||||||
|
children: {
|
||||||
|
'a': Container(
|
||||||
|
alignment: Alignment.center,
|
||||||
|
width: 130.0,
|
||||||
|
child: Text('a')
|
||||||
|
),
|
||||||
|
'c': Text('C'),
|
||||||
|
'b': Text('B'),
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,44 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter_go/common/widget_demo.dart';
|
||||||
|
import 'demo.dart';
|
||||||
|
const Text0 = '''
|
||||||
|
### **简介**
|
||||||
|
> IOS风格下用于展示一些用户可以选择的选项
|
||||||
|
|
||||||
|
将来自CupertinoSegmentedControl的child属性的Map列表中的组件, 以水平的方式展开供用户选择.这些选择是互斥的. 用户只能选择一个.
|
||||||
|
|
||||||
|
|
||||||
|
### **基本用法**
|
||||||
|
|
||||||
|
> 这个组件的重点属性在于他的child属性
|
||||||
|
|
||||||
|
在官方文档中, 它的child属性是一个Map<T,Widget>对象. 这个对象的K可以是任意对象, String/Int/Widget/Array..., 这里的T值会在每次用户点击的时候. 触发**onValueChanged<T>** 回调,
|
||||||
|
整个组件的高度, 取决于Map列表中Widget中最高的. 整个组件的宽度, 取决于Map列表中widget中最宽的 * Map的长度.
|
||||||
|
|
||||||
|
样式支持用户自定义.
|
||||||
|
''';
|
||||||
|
|
||||||
|
|
||||||
|
class Demo extends StatefulWidget {
|
||||||
|
static const String routeName =
|
||||||
|
'/element/themes/Cupertino/CupertinoSegmentedControl';
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<StatefulWidget> createState() => _DemoState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _DemoState extends State<Demo> {
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return WidgetDemo(
|
||||||
|
title: 'CupertinoSegmentedControl',
|
||||||
|
codeUrl: '/themes/Cupertino/CupertinoSegmentedControl/demo.dart',
|
||||||
|
docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoSegmentedControl-class.html',
|
||||||
|
contentList: [
|
||||||
|
Text0,
|
||||||
|
CupertinoSegmentedControlDemo(),
|
||||||
|
SizedBox(height: 100),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
34
lib/widgets/themes/Cupertino/CupertinoSlider/demo.dart
Normal file
34
lib/widgets/themes/Cupertino/CupertinoSlider/demo.dart
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
/**
|
||||||
|
* Created with Android Studio.
|
||||||
|
* User: 三帆
|
||||||
|
* Date: 15/01/2019
|
||||||
|
* Time: 22:23
|
||||||
|
* email: sanfan.hx@alibaba-inc.com
|
||||||
|
* tartget: xxx
|
||||||
|
*/
|
||||||
|
import 'package:flutter/cupertino.dart';
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class CupertinoSliderDemo extends StatefulWidget {
|
||||||
|
_Demo createState() => _Demo();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _Demo extends State<CupertinoSliderDemo> {
|
||||||
|
double value = 0.0;
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return new CupertinoSlider(
|
||||||
|
value: value,//实际进度的位置
|
||||||
|
min: 0.0,
|
||||||
|
max: 100.0,
|
||||||
|
divisions: 100,
|
||||||
|
activeColor: Colors.blue,//进度中活动部分的颜色
|
||||||
|
onChanged: (double){
|
||||||
|
setState(() {
|
||||||
|
value = double.roundToDouble();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
39
lib/widgets/themes/Cupertino/CupertinoSlider/index.dart
Normal file
39
lib/widgets/themes/Cupertino/CupertinoSlider/index.dart
Normal file
@ -0,0 +1,39 @@
|
|||||||
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:flutter_go/common/widget_demo.dart';
|
||||||
|
import 'package:flutter_go/widgets/themes/Material/MaterialColor/demo.dart';
|
||||||
|
import 'demo.dart';
|
||||||
|
const Text0 = '''
|
||||||
|
### **简介**
|
||||||
|
> 用来选择范围性的数据
|
||||||
|
|
||||||
|
CupertinoSlider 是ios风格的Slide组件,用来选择连续性的或者非连续性的数据. 默认是在一段最大值最小值间做任意值的选择. 如果你想选择间隔性的值, 例如0.0到50.0间,选择10, 15,...50.0这样的值, 给divisions设定一个非空的整数5,, 去分割区间范围.
|
||||||
|
|
||||||
|
### **基本用法**
|
||||||
|
|
||||||
|
> 与 Slider 相同, 具体查看Slider组件
|
||||||
|
''';
|
||||||
|
|
||||||
|
|
||||||
|
class Demo extends StatefulWidget {
|
||||||
|
static const String routeName =
|
||||||
|
'/element/themes/Cupertino/CupertinoSlider';
|
||||||
|
|
||||||
|
@override
|
||||||
|
State<StatefulWidget> createState() => _DemoState();
|
||||||
|
}
|
||||||
|
|
||||||
|
class _DemoState extends State<Demo> {
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return WidgetDemo(
|
||||||
|
title: 'CupertinoSlider',
|
||||||
|
codeUrl: '/themes/Cupertino/CupertinoSlider/demo.dart',
|
||||||
|
docUrl: 'https://docs.flutter.io/flutter/cupertino/CupertinoSlider-class.html',
|
||||||
|
contentList: [
|
||||||
|
Text0,
|
||||||
|
CupertinoSliderDemo(),
|
||||||
|
SizedBox(height: 100),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@ -1,10 +1,22 @@
|
|||||||
import "package:flutter/material.dart";
|
import "package:flutter/material.dart";
|
||||||
import '../../../model/widget.dart';
|
import '../../../model/widget.dart';
|
||||||
import './CupertinoScrollbar/index.dart' as CupertinoScrollbar;
|
import './CupertinoScrollbar/index.dart' as CupertinoScrollbar;
|
||||||
|
import './CupertinoSlider/index.dart' as CupertinoSlider;
|
||||||
|
import './CupertinoSegmentedControl/index.dart' as CupertinoSegmentedControl;
|
||||||
List<WidgetPoint> widgetPoints = [
|
List<WidgetPoint> widgetPoints = [
|
||||||
WidgetPoint(
|
WidgetPoint(
|
||||||
name: 'CupertinoScrollbar',
|
name: 'CupertinoScrollbar',
|
||||||
routerName: CupertinoScrollbar.Demo.routeName,
|
routerName: CupertinoScrollbar.Demo.routeName,
|
||||||
buildRouter: (BuildContext context) => CupertinoScrollbar.Demo(),
|
buildRouter: (BuildContext context) => CupertinoScrollbar.Demo(),
|
||||||
|
),
|
||||||
|
WidgetPoint(
|
||||||
|
name: 'CupertinoSlider',
|
||||||
|
routerName: CupertinoSlider.Demo.routeName,
|
||||||
|
buildRouter: (BuildContext context) => CupertinoSlider.Demo(),
|
||||||
|
),
|
||||||
|
WidgetPoint(
|
||||||
|
name: 'CupertinoSegmentedControl',
|
||||||
|
routerName: CupertinoSegmentedControl.Demo.routeName,
|
||||||
|
buildRouter: (BuildContext context) => CupertinoSegmentedControl.Demo(),
|
||||||
)
|
)
|
||||||
];
|
];
|
||||||
|
@ -164,6 +164,8 @@ flutter:
|
|||||||
- lib/widgets/themes/Material/MaterialPageRoute/demo.dart
|
- lib/widgets/themes/Material/MaterialPageRoute/demo.dart
|
||||||
- lib/widgets/themes/Material/MergeableMaterialItem/demo.dart
|
- lib/widgets/themes/Material/MergeableMaterialItem/demo.dart
|
||||||
- lib/widgets/themes/Cupertino/CupertinoScrollbar/demo.dart
|
- lib/widgets/themes/Cupertino/CupertinoScrollbar/demo.dart
|
||||||
|
- lib/widgets/themes/Cupertino/CupertinoSlider/demo.dart
|
||||||
|
- lib/widgets/themes/Cupertino/CupertinoSegmentedControl/demo.dart
|
||||||
- assets/app.db
|
- assets/app.db
|
||||||
- assets/images/
|
- assets/images/
|
||||||
- lib/common/example_code_parser.dart
|
- lib/common/example_code_parser.dart
|
||||||
|
Reference in New Issue
Block a user