flutter_paint_components 0.0.4

A new Flutter package project.

用于在画布搭建中静态渲染组件，依赖父容器统一限制大小后，内部进行渲染。

publish

flutter pub publish  

Features

• 丰富的画布搭建内置组件
• 丰富的通用函数封装

Getting started

import 'package:flutter_paint_components/flutter_paint_components.dart';

Usage

ButtonBox(
  ButtonSchema(
    data: item.data,
    alignment: item.textStyle.alignment,
    interactiveTrigger: item.textStyle.interactiveTrigger,
    interactiveType: item.textStyle.interactiveType,
    interactiveData: item.textStyle.interactiveData,
    textAlign: item.textStyle.textAlign,
    textStyle: item.textStyle.toTextStyle(),

    bgColor: item.boxStyle.bgColor,
    fgColor: item.boxStyle.fgColor,
    borderColor: item.boxStyle.borderColor,
    borderWidth: item.boxStyle.borderWidth,
    borderRadius: item.boxStyle.borderWidth,
    padding: item.boxStyle.padding,
  )
)

HotAreaBox(
  HotAreaSchema(
    interactiveTrigger: item.textStyle.interactiveTrigger,
    interactiveType: item.textStyle.interactiveType,
    interactiveData: item.textStyle.interactiveData,
  ),
  visible: true
)

PhotoBox(
  PhotoSchema(
    data: item.data,
    interactiveTrigger: item.textStyle.interactiveTrigger,
    interactiveType: item.textStyle.interactiveType,
    interactiveData: item.textStyle.interactiveData,
  )
)

TextBox(
  TextSchema(
    data: item.data,
    textStyle: item.textStyle.toTextStyle(),
    alignment: item.textStyle.alignment,
    textAlign: item.textStyle.textAlign,
    interactiveTrigger: item.textStyle.interactiveTrigger,
    interactiveType: item.textStyle.interactiveType,
    interactiveData: item.textStyle.interactiveData,
  )
)

Additional information

CustomTextStyle item.textStyle;
CustomBoxStyle item.boxStyle;

@freezed
class CustomTextStyle with _$CustomTextStyle {
  const CustomTextStyle._();
  factory CustomTextStyle({
    @JsonKey(fromJson: MyJsonSerialize.colorFromJson, toJson: MyJsonSerialize.colorToJson) @Default(Colors.black) Color color,
    @JsonKey(fromJson: MyJsonSerialize.colorFromJson, toJson: MyJsonSerialize.colorToJson) @Default(Colors.grey) Color disabledColor,
    @Default(TextAlign.center) TextAlign textAlign,
    @JsonKey(fromJson: MyJsonSerialize.alignVerticalFromJson, toJson: MyJsonSerialize.alignVerticalToJson) @Default(TextAlignVertical.center) TextAlignVertical textAlignVertical,
    @Default(14) double fontSize,
    @JsonKey(fromJson: MyJsonSerialize.fontWeightFromJson, toJson: MyJsonSerialize.fontWeightToJson) @Default(FontWeight.normal) FontWeight fontWeight,
    @Default(0) double letterSpacing,
    @Default(0) double wordSpacing,
    @Default(false) bool italic,
    @Default(TextBaseline.alphabetic) TextBaseline textBaseline,
    @JsonKey(fromJson: MyJsonSerialize.decorationFromJson, toJson: MyJsonSerialize.decorationToJson) @Default(TextDecoration.none) TextDecoration decoration,
    @Default(Font_Lato) String fontFamily,
    // 触发方式、交互类型、交互数据
    @Default('none') String interactiveTrigger,
    @Default('link') String interactiveType,
    @Default('') String interactiveData,
  }) = _CustomTextStyle;
  factory CustomTextStyle.fromJson(Map<String, dynamic> json) => _$CustomTextStyleFromJson(json);

  String get sfontSize => fontSize.toStringAsFixed(0);
  List<bool> get alignmentSeleted {
    return [textAlign == TextAlign.left, textAlign == TextAlign.center, textAlign == TextAlign.right];
  }
  List<bool> get verticalAlignmentSeleted {
    // can not campare use textAlignVertical instance
    return [textAlignVertical.y == TextAlignVertical.top.y, textAlignVertical.y == TextAlignVertical.center.y, textAlignVertical.y == TextAlignVertical.bottom.y];
  }
  Alignment get alignment {
    return textAlignVertical.y == TextAlignVertical.top.y ? Alignment.topCenter :
     (textAlignVertical.y == TextAlignVertical.center.y ? Alignment.center : Alignment.bottomCenter);
  }
  List<bool> get fontDecorationSelected {
    return [decoration == TextDecoration.none, decoration == TextDecoration.lineThrough, decoration == TextDecoration.underline];
  }
  List<bool> get fontBehaviorSelected {
    return [fontWeight == FontWeight.bold, italic];
  }
  String get scolor => MyJsonSerialize.colorToJson(color);
  TextStyle toTextStyle() {
    return TextStyle(
      color: color,
      fontSize: fontSize,
      fontWeight: fontWeight,
      letterSpacing: letterSpacing,
      wordSpacing: wordSpacing,
      textBaseline: textBaseline,
      fontFamily: fontFamily,
      decoration: decoration,
      fontStyle: italic ? FontStyle.italic : FontStyle.normal,
    );
  }
}

@freezed
class CustomBoxStyle with _$CustomBoxStyle {
  const CustomBoxStyle._();
  factory CustomBoxStyle({
    @JsonKey(fromJson: MyJsonSerialize.colorFromJson, toJson: MyJsonSerialize.colorToJson) @Default(Colors.transparent) Color bgColor,
    @JsonKey(fromJson: MyJsonSerialize.colorFromJson, toJson: MyJsonSerialize.colorToJson) @Default(Colors.grey) Color fgColor,
    @JsonKey(fromJson: MyJsonSerialize.edgeFromJson, toJson: MyJsonSerialize.edgeToJson) @Default(EdgeInsets.all(0)) EdgeInsets padding,
    @JsonKey(fromJson: MyJsonSerialize.edgeFromJson, toJson: MyJsonSerialize.edgeToJson) @Default(EdgeInsets.all(0)) EdgeInsets margin,
    @JsonKey(fromJson: MyJsonSerialize.alignmentFromJson, toJson: MyJsonSerialize.alignmentToJson) @Default(Alignment.center) Alignment alignment,
    @Default(4) double borderRadius,
    @Default(1) double borderWidth,
    @JsonKey(fromJson: MyJsonSerialize.colorFromJson, toJson: MyJsonSerialize.colorToJson) @Default(Colors.grey) Color borderColor,
  }) = _CustomBoxStyle;
  factory CustomBoxStyle.fromJson(Map<String, dynamic> json) => _$CustomBoxStyleFromJson(json);

  String get sbgColor => MyJsonSerialize.colorToJson(bgColor);
  String get sfgColor => MyJsonSerialize.colorToJson(fgColor);
  String get sborderRadius => borderRadius.toString();
  String get sborderWidth => borderWidth.toString();
  String get sborderColor => MyJsonSerialize.colorToJson(borderColor);
  // String get spadding => 
}