mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
[flutter]: question bubble popup
This commit is contained in:
parent
56324bf8b9
commit
7246f597af
@ -1,7 +1,10 @@
|
|||||||
|
import 'package:app_flowy/workspace/presentation/widgets/pop_up_action.dart';
|
||||||
import 'package:flowy_infra/theme.dart';
|
import 'package:flowy_infra/theme.dart';
|
||||||
|
import 'package:flowy_infra_ui/flowy_infra_ui.dart';
|
||||||
import 'package:flowy_infra_ui/style_widget/button.dart';
|
import 'package:flowy_infra_ui/style_widget/button.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
import 'package:provider/provider.dart';
|
import 'package:provider/provider.dart';
|
||||||
|
import 'package:dartz/dartz.dart' as dartz;
|
||||||
|
|
||||||
class QuestionBubble extends StatelessWidget {
|
class QuestionBubble extends StatelessWidget {
|
||||||
const QuestionBubble({Key? key}) : super(key: key);
|
const QuestionBubble({Key? key}) : super(key: key);
|
||||||
@ -19,8 +22,69 @@ class QuestionBubble extends StatelessWidget {
|
|||||||
fillColor: theme.selector,
|
fillColor: theme.selector,
|
||||||
mainAxisAlignment: MainAxisAlignment.center,
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
radius: BorderRadius.circular(10),
|
radius: BorderRadius.circular(10),
|
||||||
onPressed: () {},
|
onPressed: () {
|
||||||
|
final actionList = QuestionBubbleActions(onSelected: (action) {});
|
||||||
|
actionList.show(
|
||||||
|
context,
|
||||||
|
context,
|
||||||
|
anchorDirection: AnchorDirection.topWithCenterAligned,
|
||||||
|
);
|
||||||
|
},
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class QuestionBubbleActions with ActionList<QuestionBubbleActionWrapper> implements FlowyOverlayDelegate {
|
||||||
|
final Function(dartz.Option<QuestionBubbleAction>) onSelected;
|
||||||
|
final _items = QuestionBubbleAction.values.map((action) => QuestionBubbleActionWrapper(action)).toList();
|
||||||
|
|
||||||
|
QuestionBubbleActions({
|
||||||
|
required this.onSelected,
|
||||||
|
});
|
||||||
|
|
||||||
|
@override
|
||||||
|
List<QuestionBubbleActionWrapper> get items => _items;
|
||||||
|
|
||||||
|
@override
|
||||||
|
void Function(dartz.Option<QuestionBubbleActionWrapper> p1) get selectCallback => (result) {
|
||||||
|
result.fold(
|
||||||
|
() => onSelected(dartz.none()),
|
||||||
|
(wrapper) => onSelected(
|
||||||
|
dartz.some(wrapper.inner),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
@override
|
||||||
|
FlowyOverlayDelegate? get delegate => this;
|
||||||
|
|
||||||
|
@override
|
||||||
|
void didRemove() {
|
||||||
|
onSelected(dartz.none());
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
enum QuestionBubbleAction {
|
||||||
|
whatsNews,
|
||||||
|
}
|
||||||
|
|
||||||
|
class QuestionBubbleActionWrapper extends ActionItemData {
|
||||||
|
final QuestionBubbleAction inner;
|
||||||
|
|
||||||
|
QuestionBubbleActionWrapper(this.inner);
|
||||||
|
@override
|
||||||
|
Widget? get icon => null;
|
||||||
|
|
||||||
|
@override
|
||||||
|
String get name => inner.name;
|
||||||
|
}
|
||||||
|
|
||||||
|
extension QuestionBubbleExtension on QuestionBubbleAction {
|
||||||
|
String get name {
|
||||||
|
switch (this) {
|
||||||
|
case QuestionBubbleAction.whatsNews:
|
||||||
|
return "What's new";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@ -12,20 +12,16 @@ class AppDisclosureActions with ActionList<AppDisclosureActionWrapper> implement
|
|||||||
required this.onSelected,
|
required this.onSelected,
|
||||||
});
|
});
|
||||||
|
|
||||||
@override
|
|
||||||
String get identifier => "ViewDisclosureActions";
|
|
||||||
|
|
||||||
@override
|
@override
|
||||||
List<AppDisclosureActionWrapper> get items => _items;
|
List<AppDisclosureActionWrapper> get items => _items;
|
||||||
|
|
||||||
@override
|
|
||||||
double get maxWidth => 162;
|
|
||||||
|
|
||||||
@override
|
@override
|
||||||
void Function(dartz.Option<AppDisclosureActionWrapper> p1) get selectCallback => (result) {
|
void Function(dartz.Option<AppDisclosureActionWrapper> p1) get selectCallback => (result) {
|
||||||
result.fold(
|
result.fold(
|
||||||
() => onSelected(dartz.none()),
|
() => onSelected(dartz.none()),
|
||||||
(wrapper) => onSelected(dartz.some(wrapper.inner)),
|
(wrapper) => onSelected(
|
||||||
|
dartz.some(wrapper.inner),
|
||||||
|
),
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -34,9 +34,6 @@ class ViewDisclosureButton extends StatelessWidget
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
@override
|
|
||||||
String get identifier => "ViewDisclosureActions";
|
|
||||||
|
|
||||||
@override
|
@override
|
||||||
List<ViewDisclosureActionWrapper> get items => _items;
|
List<ViewDisclosureActionWrapper> get items => _items;
|
||||||
|
|
||||||
|
@ -11,9 +11,9 @@ import 'package:dartz/dartz.dart' as dartz;
|
|||||||
abstract class ActionList<T extends ActionItemData> {
|
abstract class ActionList<T extends ActionItemData> {
|
||||||
List<T> get items;
|
List<T> get items;
|
||||||
|
|
||||||
String get identifier;
|
String get identifier => toString();
|
||||||
|
|
||||||
double get maxWidth;
|
double get maxWidth => 162;
|
||||||
|
|
||||||
void Function(dartz.Option<T>) get selectCallback;
|
void Function(dartz.Option<T>) get selectCallback;
|
||||||
|
|
||||||
@ -47,7 +47,7 @@ abstract class ActionList<T extends ActionItemData> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
abstract class ActionItemData {
|
abstract class ActionItemData {
|
||||||
Widget get icon;
|
Widget? get icon;
|
||||||
String get name;
|
String get name;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -80,7 +80,7 @@ class ActionItem<T extends ActionItemData> extends StatelessWidget {
|
|||||||
height: ActionListSizes.itemHeight,
|
height: ActionListSizes.itemHeight,
|
||||||
child: Row(
|
child: Row(
|
||||||
children: [
|
children: [
|
||||||
action.icon,
|
if (action.icon != null) action.icon!,
|
||||||
HSpace(ActionListSizes.itemHPadding),
|
HSpace(ActionListSizes.itemHPadding),
|
||||||
FlowyText.medium(
|
FlowyText.medium(
|
||||||
action.name,
|
action.name,
|
||||||
|
Loading…
Reference in New Issue
Block a user