206 lines
5.2 KiB
Dart
206 lines
5.2 KiB
Dart
import 'package:flutter/material.dart';
|
||
|
||
|
||
// 扩展Widget类以添加额外的布局和样式方法
|
||
extension WidgetExtend on Widget {
|
||
/// 在当前Widget外层添加一个Container
|
||
///
|
||
/// 可以通过此方法设置容器的颜色、大小、边距、内边距、对齐方式等
|
||
/// 如果设置了gradientColors,则会应用渐变色
|
||
/// 边框和圆角也可以通过此方法自定义
|
||
/// 添加点击事件处理函数onTap会创建一个InkWell
|
||
Widget addContainer({
|
||
Color? color,
|
||
double? height,
|
||
double? width,
|
||
EdgeInsets? margin,
|
||
EdgeInsets? padding,
|
||
double? radius,
|
||
BorderRadius? borderRadius,
|
||
Border? border,
|
||
GestureTapCallback? onTap,
|
||
AlignmentGeometry? alignment,
|
||
Gradient? gradient,
|
||
List<BoxShadow>? boxShadow,
|
||
BoxConstraints? constraints,
|
||
Matrix4? transform,
|
||
Clip clipBehavior = Clip.none,
|
||
DecorationImage? image,
|
||
BlendMode? backgroundBlendMode,
|
||
BoxShape shape = BoxShape.rectangle,
|
||
double? minWidth,
|
||
double? maxWidth,
|
||
double? minHeight,
|
||
double? maxHeight,
|
||
|
||
/// 打印 widget size 只在 debug 有效
|
||
bool isPrintSize = false,
|
||
}) {
|
||
return Container(
|
||
width: width,
|
||
height: height,
|
||
margin: margin,
|
||
padding: padding,
|
||
alignment: alignment,
|
||
clipBehavior: clipBehavior,
|
||
constraints: constraints ??
|
||
BoxConstraints(
|
||
minWidth: minWidth ?? 0.0,
|
||
maxWidth: maxWidth ?? double.infinity,
|
||
minHeight: minHeight ?? 0.0,
|
||
maxHeight: maxHeight ?? double.infinity,
|
||
),
|
||
transform: transform,
|
||
decoration: BoxDecoration(
|
||
color: color,
|
||
boxShadow: boxShadow,
|
||
backgroundBlendMode: backgroundBlendMode,
|
||
shape: shape,
|
||
image: image,
|
||
gradient: gradient,
|
||
border: border,
|
||
borderRadius:
|
||
radius != null ? BorderRadius.circular(radius) : borderRadius,
|
||
),
|
||
child: this,
|
||
).addInkWell(onTap: onTap);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个Transform.translate
|
||
///
|
||
/// 通过此方法可以设置控件的偏移量,实现位置移动的效果
|
||
Widget addOffset({Offset offset = const Offset(0, 0)}) {
|
||
return Transform.translate(offset: offset, child: this);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个Padding
|
||
///
|
||
/// 通过此方法可以设置控件的内边距
|
||
Widget addPadding({EdgeInsets? padding}) {
|
||
return Padding(padding: padding ?? EdgeInsets.zero, child: this);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个Align
|
||
///
|
||
/// 通过此方法可以设置控件的对齐方式
|
||
Widget addAlign({AlignmentGeometry alignment = Alignment.centerLeft}) {
|
||
return Align(
|
||
alignment: alignment,
|
||
child: this,
|
||
);
|
||
}
|
||
|
||
Widget addCenter() {
|
||
return Center(child: this);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个GestureDetector
|
||
///
|
||
/// 通过此方法可以为控件添加点击事件处理函数
|
||
Widget addGestureDetector({
|
||
GestureTapCallback? onTap,
|
||
GestureTapCallback? onDoubleTap,
|
||
GestureLongPressCallback? onLongPress,
|
||
}) {
|
||
return GestureDetector(
|
||
onTap: onTap,
|
||
onDoubleTap: onDoubleTap,
|
||
onLongPress: onLongPress,
|
||
child: this,
|
||
);
|
||
// return GestureDetectorDebounced(
|
||
// onTap: onTap,
|
||
// child: this,
|
||
// );
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个Visibility
|
||
///
|
||
/// 通过此方法可以控制控件的显示和隐藏
|
||
Widget addVisibility({bool visible = true}) {
|
||
return Visibility(
|
||
visible: visible,
|
||
child: this,
|
||
);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个Transform.rotate
|
||
///
|
||
/// 通过此方法可以设置控件的旋转角度
|
||
Widget addRotate({double angle = 0}) {
|
||
return Transform.rotate(
|
||
angle: angle,
|
||
child: this,
|
||
);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个InkWell
|
||
///
|
||
/// 通过此方法可以为控件添加点击事件处理函数
|
||
Widget addInkWell({GestureTapCallback? onTap}) {
|
||
if (onTap == null) {
|
||
return this;
|
||
}
|
||
return InkWell(
|
||
onTap: onTap,
|
||
child: this,
|
||
);
|
||
}
|
||
|
||
|
||
|
||
/// 在当前Widget外层添加一个SizedBox
|
||
///
|
||
/// 通过此方法可以设置控件的宽高
|
||
Widget addSize({double? width, double? height}) {
|
||
return SizedBox(
|
||
width: width,
|
||
height: height,
|
||
child: this,
|
||
);
|
||
}
|
||
|
||
/// 在当前Widget外层添加一个Opacity
|
||
///
|
||
/// 通过此方法可以设置控件的透明度
|
||
Widget addOpacity({double opacity = 1}) {
|
||
return Opacity(
|
||
opacity: opacity,
|
||
child: this,
|
||
);
|
||
}
|
||
}
|
||
|
||
|
||
|
||
extension OnRenderObjectWidget on RenderObjectWidget {
|
||
SliverPadding addPaddingSliver({EdgeInsets? padding}) {
|
||
return SliverPadding(
|
||
padding: padding ?? EdgeInsets.zero,
|
||
sliver: this,
|
||
);
|
||
}
|
||
|
||
DecoratedSliver addDecoratedSliver({
|
||
Color? color,
|
||
BorderRadius? borderRadius,
|
||
Border? border,
|
||
BoxShape? shape,
|
||
Gradient? gradient,
|
||
List<BoxShadow>? boxShadow,
|
||
EdgeInsets? padding,
|
||
}) {
|
||
return DecoratedSliver(
|
||
decoration: BoxDecoration(
|
||
color: color ?? Colors.white,
|
||
border: border,
|
||
borderRadius: borderRadius,
|
||
boxShadow: boxShadow,
|
||
gradient: gradient,
|
||
shape: shape ?? BoxShape.rectangle,
|
||
),
|
||
sliver: this.addPaddingSliver(padding: padding),
|
||
);
|
||
}
|
||
}
|