zefyr/packages/zefyr/lib/src/extended_assets_picker/src/delegate/asset_picker_quick_builder_...

part of ct_assets_picker;

class ExtendedAssetPickerQuickBuilderDelegate
    extends DefaultAssetPickerBuilderDelegate {
  ExtendedAssetPickerQuickBuilderDelegate({
    @required ExtendedAssetPickerProvider provider,
    int gridCount = 4,
    Color themeColor,
    AssetsPickerTextDelegate textDelegate,
    ThemeData pickerTheme,
    SpecialItemPosition specialItemPosition = SpecialItemPosition.none,
    WidgetBuilder specialItemBuilder,
    bool allowSpecialItemWhenEmpty = false,
    List<int> previewThumbSize,
    SpecialPickerType specialPickerType,
  })  : assert(
          provider != null,
          'AssetPickerProvider must be provided and not null.',
        ),
        assert(
          pickerTheme == null || themeColor == null,
          'Theme and theme color cannot be set at the same time.',
        ),
        super(
          provider: provider,
          gridCount: gridCount,
          themeColor: themeColor,
          textDelegate: textDelegate,
          pickerTheme: pickerTheme,
          specialItemPosition: specialItemPosition,
          specialItemBuilder: specialItemBuilder,
          allowSpecialItemWhenEmpty: allowSpecialItemWhenEmpty,
          previewThumbSize: previewThumbSize,
          specialPickerType: specialPickerType,
        ) {
    Constants.textDelegate = textDelegate ?? DefaultAssetsPickerTextDelegate();
  }

  @override
  bool get isAppleOS => true;

  @override
  double get appleOSBlurRadius => 0;

  /// The main grid view builder for assets.
  /// 主要的资源查看列表部件
  Widget assetsListBuilder(BuildContext context) {
    return ColoredBox(
      color: theme.canvasColor,
      child: Selector<AssetPickerProvider<AssetEntity, AssetPathEntity>,
          List<AssetEntity>>(
        selector: (BuildContext _,
                AssetPickerProvider<AssetEntity, AssetPathEntity> provider) =>
            provider.currentAssets,
        builder: (
          BuildContext _,
          List<AssetEntity> currentAssets,
          Widget __,
        ) {
          return ListView.builder(
            scrollDirection: Axis.horizontal,
            physics: ClampingScrollPhysics(),
            padding: EdgeInsets.zero,
            itemCount: assetsGridItemCount(_, currentAssets),
            itemBuilder: (BuildContext _, int index) {
              return assetGridItemBuilder(_, index, currentAssets);
            },
          );
        },
      ),
    );
  }

  @override
  Widget assetGridItemBuilder(
      BuildContext context, int index, List<AssetEntity> assets) {
    return Padding(
      padding: EdgeInsets.only(left: index != 0 ? 4 : 0),
      child: AspectRatio(
        aspectRatio: 0.5,
        child: super.assetGridItemBuilder(context, index, assets),
      ),
    );
  }

  @override
  int assetsGridItemCount(
    BuildContext context,
    List<AssetEntity> currentAssets,
  ) {
    final AssetPathEntity currentPathEntity =
        Provider.of<DefaultAssetPickerProvider>(
      context,
      listen: false,
    ).currentPathEntity;

    if (currentPathEntity == null &&
        specialItemPosition != SpecialItemPosition.none) {
      return 1;
    }

    /// Return actual length if current path is all.
    /// 如果当前目录是全部内容，则返回实际的内容数量。
    if (!(currentPathEntity?.isAll ?? false)) {
      return currentAssets?.length ?? 0;
    }
    int length;
    switch (specialItemPosition) {
      case SpecialItemPosition.none:
        length = currentAssets.length;
        break;
      case SpecialItemPosition.prepend:
      case SpecialItemPosition.append:
        length = currentAssets.length + 1;
        break;
    }
    return length;
  }

  /// It'll pop with [AssetPickerProvider.selectedAssets]
  /// when there're any assets chosen.
  /// 当有资源已选时，点击按钮将把已选资源通过路由返回。
  @override
  Widget confirmButton(BuildContext context) {
    final zefyrTheme = ZefyrTheme.of(context).toolbarTheme;
    final toolbar = ZefyrToolbar.of(context);
    return Consumer<DefaultAssetPickerProvider>(
      builder: (
        BuildContext _,
        DefaultAssetPickerProvider provider,
        Widget __,
      ) {
        return FlatButton(
          minWidth: provider.isSelectedNotEmpty ? 48.0 : 20.0,
          height: appBarItemHeight,
          shape: StadiumBorder(),
          padding: const EdgeInsets.symmetric(horizontal: 12.0),
          color: provider.isSelectedNotEmpty
              ? zefyrTheme.toggleColor
              : zefyrTheme.disabledIconColor,
          child: Text(
            provider.isSelectedNotEmpty && !isSingleAssetMode
                ? '${Constants.textDelegate.confirm}'
                    '(${provider.selectedAssets.length}/${provider.maxAssets})'
                : Constants.textDelegate.confirm,
            style: TextStyle(
              color: Colors.white,
              fontSize: 16.0,
              fontWeight: FontWeight.normal,
            ),
          ),
          onPressed: () async {
            if (provider.isSelectedNotEmpty) {
              toolbar.editor.closeKeyboard(true);
              for (var asset in provider.selectedAssets) {
                var file = await asset.originFile;
                final image = await toolbar.editor.imageDelegate.picked(
                    file, (provider as ExtendedAssetPickerProvider).fullImage);
                if (image != null) {
                  toolbar.editor
                      .formatSelection(NotusAttribute.embed.image(image));
                  toolbar.editor.closeKeyboard();
                }
              }
            }
          },
          materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
        );
      },
    );
  }

  Widget fullImageButton(BuildContext context) {
    final zefyrTheme = ZefyrTheme.of(context).toolbarTheme;
    return Selector<DefaultAssetPickerProvider, bool>(
      selector: (BuildContext _, DefaultAssetPickerProvider provider) =>
          (provider as ExtendedAssetPickerProvider).fullImage,
      builder: (BuildContext _, bool fullImage, Widget __) {
        return GestureDetector(
          onTap: () {
            (provider as ExtendedAssetPickerProvider).fullImage = !fullImage;
          },
          child: Row(
            mainAxisSize: MainAxisSize.min,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Container(
                // margin: EdgeInsets.all(Screens.width / gridCount / 15.0),
                width: 18,
                height: 18,
                alignment: Alignment.center,
                child: AnimatedContainer(
                  duration: switchingPathDuration,
                  width: 18,
                  height: 18,
                  decoration: BoxDecoration(
                    border: Border.all(
                        color: fullImage
                            ? zefyrTheme.toggleColor
                            : zefyrTheme.disabledIconColor,
                        width: 2.0),
                    color: null,
                    shape: BoxShape.circle,
                  ),
                  child: AnimatedSwitcher(
                    duration: switchingPathDuration,
                    reverseDuration: switchingPathDuration,
                    child: fullImage
                        ? Container(
                            width: 10,
                            height: 10,
                            decoration: BoxDecoration(
                              color: zefyrTheme.toggleColor,
                              shape: BoxShape.circle,
                            ),
                          )
                        : const SizedBox.shrink(),
                  ),
                ),
              ),
              SizedBox(
                width: 8,
              ),
              Text(
                Constants.textDelegate.original,
                style: TextStyle(
                  color: zefyrTheme.iconColor,
                  fontSize: 16.0,
                ),
              ),
            ],
          ),
        );
      },
    );
  }

  /// Action bar widget aligned to bottom.
  /// 底部操作栏部件
  @override
  Widget bottomActionBar(BuildContext context) {
    final zefyrTheme = ZefyrTheme.of(context).toolbarTheme;
    return Container(
      height: kToolbarHeight + Screens.bottomSafeHeight,
      color: zefyrTheme.color,
      padding: EdgeInsets.symmetric(horizontal: 20).copyWith(
        bottom: Screens.bottomSafeHeight,
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          fullImageButton(context),
          confirmButton(context),
        ],
      ),
    );
  }
  
  @override
  Widget selectIndicator(BuildContext context, AssetEntity asset) {
    final zefyrTheme = ZefyrTheme.of(context).toolbarTheme;
    if (isSingleAssetMode) {
      return Container();
    }
    return Selector<DefaultAssetPickerProvider, List<AssetEntity>>(
      selector: (BuildContext _, DefaultAssetPickerProvider provider) =>
          provider.selectedAssets,
      builder: (BuildContext _, List<AssetEntity> selectedAssets, Widget __) {
        final bool selected = selectedAssets.contains(asset);
        final double indicatorSize = Screens.width / gridCount / 3;
        return Positioned(
          top: 0.0,
          right: 0.0,
          child: GestureDetector(
            behavior: HitTestBehavior.opaque,
            onTap: () {
              if (selected) {
                provider.unSelectAsset(asset);
              } else {
                if (isSingleAssetMode) {
                  provider.selectedAssets.clear();
                }
                provider.selectAsset(asset);
              }
            },
            child: Container(
              margin: EdgeInsets.all(Screens.width / gridCount / 15.0),
              width: indicatorSize,
              height: indicatorSize,
              alignment: AlignmentDirectional.topEnd,
              child: AnimatedContainer(
                duration: switchingPathDuration,
                width: indicatorSize / 1.5,
                height: indicatorSize / 1.5,
                decoration: BoxDecoration(
                  border: !selected
                      ? Border.all(color: Colors.white, width: 2.0)
                      : null,
                  color: selected ? zefyrTheme.toggleColor : null,
                  shape: BoxShape.circle,
                ),
                child: AnimatedSwitcher(
                  duration: switchingPathDuration,
                  reverseDuration: switchingPathDuration,
                  child: selected
                      ? isSingleAssetMode
                          ? const Icon(Icons.check, size: 18.0)
                          : Text(
                              '${selectedAssets.indexOf(asset) + 1}',
                              style: TextStyle(
                                color: selected
                                    ? Colors.white
                                    : null,
                                fontSize: 14.0,
                                fontWeight: isAppleOS
                                    ? FontWeight.w600
                                    : FontWeight.bold,
                              ),
                            )
                      : const SizedBox.shrink(),
                ),
              ),
            ),
          ),
        );
      },
    );
  }

  @override
  Widget selectedBackdrop(BuildContext context, int index, AssetEntity asset) {
    return Selector<DefaultAssetPickerProvider, List<AssetEntity>>(
      selector: (BuildContext _, DefaultAssetPickerProvider provider) =>
          provider.selectedAssets,
      builder: (BuildContext _, List<AssetEntity> selectedAssets, Widget __) {
        final bool selected = selectedAssets.contains(asset);
        return Positioned.fill(
          child: GestureDetector(
            onTap: () async {
              if (isSingleAssetMode) {
                Navigator.of(context).pop(AssetPickerEntity(
                  assets: [asset],
                  isFullImage: (provider as ExtendedAssetPickerProvider).fullImage,
                ));
                return;
              }
              final List<AssetEntity> result =
                  await ExtendedAssetPickerViewer.pushToViewer(
                context,
                currentIndex: index,
                previewAssets: provider.currentAssets,
                previewThumbSize: previewThumbSize,
                selectedAssets: provider.selectedAssets,
                selectorProvider: provider as ExtendedAssetPickerProvider,
                themeData: theme,
              );
              if (result != null) {
                Navigator.of(context).pop(AssetPickerEntity(
                  assets: result,
                  isFullImage: (provider as ExtendedAssetPickerProvider).fullImage,
                ));
              }
            },
            child: AnimatedContainer(
              duration: switchingPathDuration,
              color: selected
                  ? Colors.black.withOpacity(0.45)
                  : Colors.black.withOpacity(0.1),
            ),
          ), // 点击预览同目录下所有资源
        );
      },
    );
  }

  /// Yes, the build method.
  /// 没错，是它是它就是它，我们亲爱的 build 方法~
  @override
  Widget build(BuildContext context) {
    final zefyrTheme = ZefyrTheme.of(context).toolbarTheme;
    final toolbar = ZefyrToolbar.of(context);
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: overlayStyle,
      child: Theme(
        data: theme,
        child: ChangeNotifierProvider<
            AssetPickerProvider<AssetEntity, AssetPathEntity>>.value(
          value: provider,
          child: Material(
            color: theme.canvasColor,
            child: Container(
              child: Column(
                children: <Widget>[
                  Expanded(
                    child: Container(
                      decoration: BoxDecoration(
                        border: Border(
                          top: BorderSide(color: theme.dividerColor, width: 1),
                          bottom:
                              BorderSide(color: theme.dividerColor, width: 1),
                        ),
                      ),
                      child: Row(
                        children: [
                          Container(
                            width: 58,
                            child: Column(
                              children: [
                                Expanded(
                                  child: FlatButton(
                                      shape: RoundedRectangleBorder(),
                                      color: zefyrTheme.captionColor,
                                      padding: EdgeInsets.zero,
                                      onPressed: () {
                                        ExtendedAssetPicker.getImageFromCamera()
                                            .then((result) {
                                          if (result != null) {
                                            toolbar.closeOverlay();
                                            toolbar.editor.imageDelegate.picked(result, true);
                                          }
                                        });
                                      },
                                      child: Container(
                                        child: Column(
                                          mainAxisAlignment:
                                              MainAxisAlignment.center,
                                          children: [
                                            Icon(
                                              kDefaultButtonIcons[
                                                  ZefyrToolbarAction
                                                      .cameraImage],
                                              size: 24,
                                              color: Color(0xFFBFBFBF),
                                            ),
                                            Padding(
                                              padding: EdgeInsets.only(top: 6),
                                              child: Text(
                                                (Constants.textDelegate
                                                        as ExtendedAssetsPickerTextDelegate)
                                                    .camera,
                                                style: TextStyle(
                                                  fontSize: 12,
                                                  color: Color(0xFF8C8C8C),
                                                ),
                                              ),
                                            )
                                          ],
                                        ),
                                      )),
                                ),
                                Expanded(
                                  child: FlatButton(
                                      shape: RoundedRectangleBorder(),
                                      color: zefyrTheme.captionColor,
                                      padding: EdgeInsets.zero,
                                      onPressed: () {
                                        final editor =
                                            ZefyrToolbar.of(context).editor;
                                        // var _selection = toolbar.editor.selection;
                                        editor.closeKeyboard(true);
                                        ExtendedAssetPicker.pickAssets(context,
                                                requestType: RequestType.image)
                                            .then((result) async {
                                          if (result != null) {
                                            for (var asset in result.assets) {
                                              var file = await asset.originFile;
                                              final image = await editor
                                                  .imageDelegate
                                                  .picked(
                                                      file, result.isFullImage);
                                              if (image != null) {
                                                editor.formatSelection(
                                                    NotusAttribute.embed
                                                        .image(image));
                                                editor.closeKeyboard();
                                              }
                                            }
                                          }
                                        });
                                      },
                                      child: Container(
                                        child: Column(
                                          mainAxisAlignment:
                                              MainAxisAlignment.center,
                                          children: [
                                            Icon(
                                              kDefaultButtonIcons[
                                                  ZefyrToolbarAction
                                                      .galleryImage],
                                              size: 24,
                                              color: Color(0xFFBFBFBF),
                                            ),
                                            Padding(
                                              padding: EdgeInsets.only(top: 6),
                                              child: Text(
                                                (Constants.textDelegate
                                                        as ExtendedAssetsPickerTextDelegate)
                                                    .album,
                                                style: TextStyle(
                                                  fontSize: 12,
                                                  color: Color(0xFF8C8C8C),
                                                ),
                                              ),
                                            )
                                          ],
                                        ),
                                      )),
                                ),
                              ],
                            ),
                          ),
                          Expanded(
                            child: Listener(
                              behavior: HitTestBehavior.translucent,
                              onPointerUp: (PointerUpEvent event) {
                                toolbar.editor.keepOverlay = true;
                              },
                              child: assetsListBuilder(context),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                  bottomActionBar(context),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}