React Native 和 Flutter widget 对等的组件

React Native 和 Flutter widget 对等的组件

下面的表格列举了通用的 React Native 组件与对应的 Flutter widget 和通用的 widget 属性。

React Native Component Flutter widget 描述
Button Raised Button 基本的悬浮按钮
onPressed [required] 该回调函数在当按钮被点击的时候被触发。
Child 按钮的标签
Button Flat Button 基本的平面按钮
onPressed [required] 该回调函数在当按钮被点击的时候被触发。
Child The button’s label.
ScrollView ListView 一个可滑动的纵向排列的 widget 列表。
children ( <Widget> [ ]) 要显示的子 widget 列表
controller [ Scroll Controller ] 可用于控制滑动 widget 的对象
itemExtent [ double ] 如果非空，那么强制所有子 widget 在滑动方向上增加给定的距离
scroll Direction [ Axis ] 滑动页面的滑动轴
FlatList ListView. builder() 根据需要创建的一组 widget 的构造函数。
itemBuilder [required] [ Indexed Widget Builder] 根据需要创建子 widget。当元素序号大于等于零并且小于队列元素总数时，该回调函数会被调用。
itemCount [ int ] 优化了 ListView 对于最大滑动范围的预估能力。
Image Image 显示图片的 widget。
image [required] 要显示的图片
Image. asset 有多个构造函数可以用于指定图片。
宽, 高, 颜色, alignment 图片的风格和布局。
fit 将图片内嵌到布局对应的空间里。I
Modal ModalRoute 避免和之前路径交叉的路径。
animation 路径切换的动画和之前路径向前切换的动画。
Activity Indicator Circular Progress Indicator 一个圆形的进度条 widget。
strokeWidth 圆形线条的宽度。
backgroundColor 指示进度的背景色。默认是当前主题的 ThemeData.backgroundColor。
Activity Indicator Linear Progress Indicator 一个水平条形的进度条。
value 进度值。
Refresh Control Refresh Indicator 支持 Material 中滑动刷新的 widget
color 进度指示的前景色。
onRefresh 当用户拖拽刷新指示器想要刷新的时候会调用该函数。
View Container 封装子 widget 的 widget。
View Column 将子 widget 纵向排列的 widget。
View Row 将子 widget 横向排列的 widget。
View Center 将子 widget 放置于中央的 widget。
View Padding 将子 widget 按照给定的间隔进行排列的 widget。
padding [required] [ EdgeInsets ] 子 widget 间隔。
Touchable Opacity Gesture Detector 检测手势的 widget。
onTap 当点击的时候会调用。
onDoubleTap 当两次点击的时候会调用。
Text Input Text Input 调用系统文本输入的接口。
controller [ Text Editing Controller ] 用于获取或者修改文本。
Text Text 以单一的样式显示文本的文本 widget。
data [ String ] 要显示的文本。
textDirection [ Text Align ]文本的方向。
Switch Switch Material Design 样式的开关。
value [required] [ boolean ] 开关的开启或者闭合状态。
onChanged [required] [ callback ] 当用户点击开关的时候调用。
Slider Slider 选择一个范围的值。
value [required] [ double ] 当前滑动器的值。
onChanged [required] 当用户为滑动器选择了新的值时会调用