aiden
/
fluffychat
mirror of https://github.com/krille-chan/fluffychat
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

make popup dimensions dynamic

Browse Source
pull/1428/head
ggurdin 1 year ago
parent cc285232fe
commit 2bc421e6e7
No known key found for this signature in database
GPG Key ID: A01CB41737CBB478
8 changed files with 187 additions and 187 deletions
Show Stats Download Patch File Download Diff File

7
lib/pangea/choreographer/controllers/choreographer.dart
Unescape Escape View File

@ -74,8 +74,11 @@ class Choreographer {
CanSendStatus.showPaywall) { CanSendStatus.showPaywall) {
OverlayUtil.showPositionedCard( OverlayUtil.showPositionedCard(
context: context, context: context,
cardToShow: const PaywallCard(), cardToShow: PaywallCard(
cardSize: const Size(325, 325), chatController: chatController,
),
maxHeight: 325,
maxWidth: 325,
transformTargetId: inputTransformTargetKey, transformTargetId: inputTransformTargetKey,
); );
return; return;

3
lib/pangea/choreographer/controllers/igc_controller.dart
Unescape Escape View File

@ -124,7 +124,8 @@ class IgcController {
), ),
roomId: choreographer.roomId, roomId: choreographer.roomId,
), ),
cardSize: match.isITStart ? const Size(350, 260) : const Size(400, 400), maxHeight: match.isITStart ? 260 : 400,
maxWidth: match.isITStart ? 350 : 400,
transformTargetId: choreographer.inputTransformTargetKey, transformTargetId: choreographer.inputTransformTargetKey,
); );
} }

3
lib/pangea/choreographer/widgets/it_bar.dart
Unescape Escape View File

@ -339,7 +339,8 @@ class ITChoices extends StatelessWidget {
), ),
choiceFeedback: choiceFeedback, choiceFeedback: choiceFeedback,
), ),
cardSize: const Size(300, 300), maxHeight: 300,
maxWidth: 300,
borderColor: borderColor, borderColor: borderColor,
transformTargetId: controller.choreographer.itBarTransformTargetKey, transformTargetId: controller.choreographer.itBarTransformTargetKey,
backDropToDismiss: false, backDropToDismiss: false,

17
lib/pangea/utils/instructions.dart
Unescape Escape View File

@ -106,21 +106,18 @@ class InstructionsController {
onClose: () => {_instructionsClosed[key.toString()] = true}, onClose: () => {_instructionsClosed[key.toString()] = true},
), ),
const SizedBox(height: 10.0), const SizedBox(height: 10.0),
Expanded( Padding(
child: SingleChildScrollView( padding: const EdgeInsets.all(6.0),
child: Padding( child: Text(
padding: const EdgeInsets.all(6.0), key.body(context),
child: Text( style: botStyle,
key.body(context),
style: botStyle,
),
),
), ),
), ),
if (showToggle) InstructionsToggle(instructionsKey: key), if (showToggle) InstructionsToggle(instructionsKey: key),
], ],
), ),
cardSize: const Size(300.0, 300.0), maxHeight: 300,
maxWidth: 300,
transformTargetId: transformTargetKey, transformTargetId: transformTargetKey,
closePrevOverlay: false, closePrevOverlay: false,
), ),

229
lib/pangea/utils/overlay.dart
Unescape Escape View File

@ -1,8 +1,6 @@
import 'dart:developer'; import 'dart:developer';
import 'dart:math';
import 'dart:ui'; import 'dart:ui';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/pangea/utils/any_state_holder.dart'; import 'package:fluffychat/pangea/utils/any_state_holder.dart';
import 'package:fluffychat/pangea/widgets/common_widgets/overlay_container.dart'; import 'package:fluffychat/pangea/widgets/common_widgets/overlay_container.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
@ -22,10 +20,8 @@ class OverlayUtil {
required BuildContext context, required BuildContext context,
required Widget child, required Widget child,
required String transformTargetId, required String transformTargetId,
// Size? size,
double? width, double? width,
double? height, double? height,
Offset? offset,
backDropToDismiss = true, backDropToDismiss = true,
blurBackground = false, blurBackground = false,
Color? borderColor, Color? borderColor,
@ -63,13 +59,13 @@ class OverlayUtil {
child: (position != OverlayPositionEnum.transform) child: (position != OverlayPositionEnum.transform)
? child ? child
: CompositedTransformFollower( : CompositedTransformFollower(
targetAnchor: targetAnchor ?? Alignment.topLeft, targetAnchor: targetAnchor ?? Alignment.topCenter,
followerAnchor: followerAnchor ?? Alignment.topLeft, followerAnchor:
followerAnchor ?? Alignment.bottomCenter,
link: MatrixState.pAnyState link: MatrixState.pAnyState
.layerLinkAndKey(transformTargetId) .layerLinkAndKey(transformTargetId)
.link, .link,
showWhenUnlinked: false, showWhenUnlinked: false,
offset: offset ?? Offset.zero,
child: child, child: child,
), ),
), ),
@ -89,8 +85,9 @@ class OverlayUtil {
static showPositionedCard({ static showPositionedCard({
required BuildContext context, required BuildContext context,
required Widget cardToShow, required Widget cardToShow,
required Size cardSize,
required String transformTargetId, required String transformTargetId,
required double maxHeight,
required double maxWidth,
backDropToDismiss = true, backDropToDismiss = true,
Color? borderColor, Color? borderColor,
bool closePrevOverlay = true, bool closePrevOverlay = true,
@ -103,11 +100,6 @@ class OverlayUtil {
return; return;
} }
final Offset cardOffset = _calculateCardOffset(
cardSize: cardSize,
transformTargetContext: layerLinkAndKey.key.currentContext!,
);
final Widget child = Material( final Widget child = Material(
borderOnForeground: false, borderOnForeground: false,
color: Colors.transparent, color: Colors.transparent,
@ -115,16 +107,15 @@ class OverlayUtil {
child: OverlayContainer( child: OverlayContainer(
cardToShow: cardToShow, cardToShow: cardToShow,
borderColor: borderColor, borderColor: borderColor,
maxHeight: maxHeight,
maxWidth: maxWidth,
), ),
); );
showOverlay( showOverlay(
context: context, context: context,
child: child, child: child,
width: cardSize.width,
height: cardSize.height,
transformTargetId: transformTargetId, transformTargetId: transformTargetId,
offset: cardOffset,
backDropToDismiss: backDropToDismiss, backDropToDismiss: backDropToDismiss,
borderColor: borderColor, borderColor: borderColor,
closePrevOverlay: closePrevOverlay, closePrevOverlay: closePrevOverlay,
@ -135,73 +126,73 @@ class OverlayUtil {
} }
} }
/// calculates the card offset relative to the target // /// calculates the card offset relative to the target
/// identified by [transformTargetKey] // /// identified by [transformTargetKey]
static Offset _calculateCardOffset({ // static Offset _calculateCardOffset({
required Size cardSize, // required Size cardSize,
required BuildContext transformTargetContext, // required BuildContext transformTargetContext,
final double minPadding = 10.0, // final double minPadding = 10.0,
}) { // }) {
// debugger(when: kDebugMode); // // debugger(when: kDebugMode);
//Note: assumes overlay in chatview // //Note: assumes overlay in chatview
final OverlayConstraints constraints = // final OverlayConstraints constraints =
ChatViewConstraints(transformTargetContext); // ChatViewConstraints(transformTargetContext);
final RenderObject? targetRenderBox = // final RenderObject? targetRenderBox =
transformTargetContext.findRenderObject(); // transformTargetContext.findRenderObject();
if (targetRenderBox == null) return Offset.zero; // if (targetRenderBox == null) return Offset.zero;
final Offset transformTargetOffset = // final Offset transformTargetOffset =
(targetRenderBox as RenderBox).localToGlobal(Offset.zero); // (targetRenderBox as RenderBox).localToGlobal(Offset.zero);
final Size transformTargetSize = targetRenderBox.size; // final Size transformTargetSize = targetRenderBox.size;
// ideally horizontally centered on target // // ideally horizontally centered on target
double dx = transformTargetSize.width / 2 - cardSize.width / 2; // double dx = transformTargetSize.width / 2 - cardSize.width / 2;
// make sure it's not off the left edge of the screen // // make sure it's not off the left edge of the screen
// if transformTargetOffset.dx + dc < constraints.x0 + minPadding // // if transformTargetOffset.dx + dc < constraints.x0 + minPadding
if (transformTargetOffset.dx + dx < minPadding + constraints.x0) { // if (transformTargetOffset.dx + dx < minPadding + constraints.x0) {
debugPrint("setting dx"); // debugPrint("setting dx");
dx = minPadding + constraints.x0 - transformTargetOffset.dx; // dx = minPadding + constraints.x0 - transformTargetOffset.dx;
} // }
// make sure it's not off the right edge of the screen // // make sure it's not off the right edge of the screen
if (transformTargetOffset.dx + dx + cardSize.width + minPadding > // if (transformTargetOffset.dx + dx + cardSize.width + minPadding >
constraints.x1) { // constraints.x1) {
dx = constraints.x1 - // dx = constraints.x1 -
transformTargetOffset.dx - // transformTargetOffset.dx -
cardSize.width - // cardSize.width -
minPadding; // minPadding;
} // }
// if there's more room above target, // // if there's more room above target,
// put the card there // // put the card there
// else, // // else,
// put it below // // put it below
// debugPrint( // // debugPrint(
// "transformTargetOffset.dx ${transformTargetOffset.dx} transformTargetOffset.dy ${transformTargetOffset.dy}"); // // "transformTargetOffset.dx ${transformTargetOffset.dx} transformTargetOffset.dy ${transformTargetOffset.dy}");
// debugPrint( // // debugPrint(
// "transformTargetSize.width ${transformTargetSize.width} transformTargetSize.height ${transformTargetSize.height}"); // // "transformTargetSize.width ${transformTargetSize.width} transformTargetSize.height ${transformTargetSize.height}");
double dy = transformTargetOffset.dy > // double dy = transformTargetOffset.dy >
constraints.y1 - // constraints.y1 -
transformTargetOffset.dy - // transformTargetOffset.dy -
transformTargetSize.height // transformTargetSize.height
? -cardSize.height - minPadding // ? -cardSize.height - minPadding
: transformTargetSize.height + minPadding; // : transformTargetSize.height + minPadding;
// make sure it's not off the top edge of the screen // // make sure it's not off the top edge of the screen
if (dy < minPadding + constraints.y0 - transformTargetOffset.dy) { // if (dy < minPadding + constraints.y0 - transformTargetOffset.dy) {
dy = minPadding + constraints.y0 - transformTargetOffset.dy; // dy = minPadding + constraints.y0 - transformTargetOffset.dy;
} // }
// make sure it's not off the bottom edge of the screen // // make sure it's not off the bottom edge of the screen
if (transformTargetOffset.dy + dy + cardSize.height + minPadding > // if (transformTargetOffset.dy + dy + cardSize.height + minPadding >
constraints.y1) { // constraints.y1) {
dy = constraints.y1 - // dy = constraints.y1 -
transformTargetOffset.dy - // transformTargetOffset.dy -
cardSize.height - // cardSize.height -
minPadding; // minPadding;
} // }
// debugPrint("dx $dx dy $dy"); // // debugPrint("dx $dx dy $dy");
return Offset(dx, dy); // return Offset(dx, dy);
} // }
static bool get isOverlayOpen => MatrixState.pAnyState.entries.isNotEmpty; static bool get isOverlayOpen => MatrixState.pAnyState.entries.isNotEmpty;
} }
@ -250,48 +241,48 @@ class TransparentBackdrop extends StatelessWidget {
} }
} }
/// global coordinates that the overlay should stay inside // /// global coordinates that the overlay should stay inside
abstract class OverlayConstraints { // abstract class OverlayConstraints {
late double x0; // late double x0;
late double y0; // late double y0;
late double x1; // late double x1;
late double y1; // late double y1;
} // }
class ChatViewConstraints implements OverlayConstraints { // class ChatViewConstraints implements OverlayConstraints {
@override // @override
late double x0; // late double x0;
@override // @override
late double y0; // late double y0;
@override // @override
late double x1; // late double x1;
@override // @override
late double y1; // late double y1;
ChatViewConstraints(BuildContext context) { // ChatViewConstraints(BuildContext context) {
final MediaQueryData mediaQueryData = // final MediaQueryData mediaQueryData =
MediaQuery.of(Scaffold.of(context).context); // MediaQuery.of(Scaffold.of(context).context);
final bool isColumnMode = FluffyThemes.isColumnMode(context); // final bool isColumnMode = FluffyThemes.isColumnMode(context);
x0 = isColumnMode // x0 = isColumnMode
? AppConfig.columnWidth + 70.0 // ? AppConfig.columnWidth + 70.0
: max(mediaQueryData.viewPadding.left, mediaQueryData.viewInsets.left); // : max(mediaQueryData.viewPadding.left, mediaQueryData.viewInsets.left);
y0 = max(mediaQueryData.viewPadding.top, mediaQueryData.viewInsets.top); // y0 = max(mediaQueryData.viewPadding.top, mediaQueryData.viewInsets.top);
x1 = mediaQueryData.size.width - // x1 = mediaQueryData.size.width -
max(mediaQueryData.viewPadding.right, mediaQueryData.viewInsets.right); // max(mediaQueryData.viewPadding.right, mediaQueryData.viewInsets.right);
y1 = mediaQueryData.size.height - // y1 = mediaQueryData.size.height -
max( // max(
mediaQueryData.viewPadding.bottom, // mediaQueryData.viewPadding.bottom,
mediaQueryData.viewInsets.bottom, // mediaQueryData.viewInsets.bottom,
); // );
// https://medium.com/flutter-community/a-flutter-guide-to-visual-overlap-padding-viewpadding-and-viewinsets-a63e214be6e8 // // https://medium.com/flutter-community/a-flutter-guide-to-visual-overlap-padding-viewpadding-and-viewinsets-a63e214be6e8
// debugPrint( // // debugPrint(
// "viewInsets ${mediaQueryData.viewInsets.left} ${mediaQueryData.viewInsets.top} ${mediaQueryData.viewInsets.right} ${mediaQueryData.viewInsets.bottom}"); // // "viewInsets ${mediaQueryData.viewInsets.left} ${mediaQueryData.viewInsets.top} ${mediaQueryData.viewInsets.right} ${mediaQueryData.viewInsets.bottom}");
// debugPrint( // // debugPrint(
// "padding ${mediaQueryData.padding.left} ${mediaQueryData.padding.top} ${mediaQueryData.padding.right} ${mediaQueryData.padding.bottom}"); // // "padding ${mediaQueryData.padding.left} ${mediaQueryData.padding.top} ${mediaQueryData.padding.right} ${mediaQueryData.padding.bottom}");
// debugPrint( // // debugPrint(
// "viewPadding ${mediaQueryData.viewPadding.left} ${mediaQueryData.viewPadding.top} ${mediaQueryData.viewPadding.right} ${mediaQueryData.viewPadding.bottom}"); // // "viewPadding ${mediaQueryData.viewPadding.left} ${mediaQueryData.viewPadding.top} ${mediaQueryData.viewPadding.right} ${mediaQueryData.viewPadding.bottom}");
// debugPrint("chatViewConstraints x0: $x0 y0: $y0 x1: $x1 y1: $y1"); // // debugPrint("chatViewConstraints x0: $x0 y0: $y0 x1: $x1 y1: $y1");
} // }
} // }

19
lib/pangea/widgets/common_widgets/overlay_container.dart
Unescape Escape View File

@ -2,14 +2,16 @@ import 'package:flutter/material.dart';
class OverlayContainer extends StatelessWidget { class OverlayContainer extends StatelessWidget {
final Widget cardToShow; final Widget cardToShow;
final Size cardSize;
final Color? borderColor; final Color? borderColor;
final double maxHeight;
final double maxWidth;
const OverlayContainer({ const OverlayContainer({
super.key, super.key,
required this.cardToShow, required this.cardToShow,
this.cardSize = const Size(300.0, 300.0),
this.borderColor, this.borderColor,
required this.maxHeight,
required this.maxWidth,
}); });
@override @override
@ -28,14 +30,17 @@ class OverlayContainer extends StatelessWidget {
), ),
), ),
constraints: BoxConstraints( constraints: BoxConstraints(
maxWidth: cardSize.width, maxWidth: maxWidth,
maxHeight: cardSize.height, maxHeight: maxHeight,
minWidth: cardSize.width,
minHeight: cardSize.height,
), ),
//PTODO - position card above input/message //PTODO - position card above input/message
// margin: const EdgeInsets.all(10), // margin: const EdgeInsets.all(10),
child: cardToShow, child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [cardToShow],
),
),
); );
} }
} }

14
lib/pangea/widgets/igc/pangea_text_controller.dart
Unescape Escape View File

@ -54,8 +54,11 @@ class PangeaTextController extends TextEditingController {
text.isNotEmpty) { text.isNotEmpty) {
OverlayUtil.showPositionedCard( OverlayUtil.showPositionedCard(
context: context, context: context,
cardToShow: const PaywallCard(), cardToShow: PaywallCard(
cardSize: const Size(325, 325), chatController: choreographer.chatController,
),
maxHeight: 325,
maxWidth: 325,
transformTargetId: choreographer.inputTransformTargetKey, transformTargetId: choreographer.inputTransformTargetKey,
); );
} }
@ -112,10 +115,11 @@ class PangeaTextController extends TextEditingController {
if (cardToShow != null) { if (cardToShow != null) {
OverlayUtil.showPositionedCard( OverlayUtil.showPositionedCard(
context: context, context: context,
cardSize: matchIndex != -1 && maxHeight: matchIndex != -1 &&
choreographer.igc.igcTextData!.matches[matchIndex].isITStart choreographer.igc.igcTextData!.matches[matchIndex].isITStart
? const Size(350, 260) ? 260
: const Size(350, 400), : 400,
maxWidth: 350,
cardToShow: cardToShow, cardToShow: cardToShow,
transformTargetId: choreographer.inputTransformTargetKey, transformTargetId: choreographer.inputTransformTargetKey,
); );

82
lib/pangea/widgets/igc/span_card.dart
Unescape Escape View File

@ -237,49 +237,47 @@ class WordMatchContent extends StatelessWidget {
? controller.currentExpression ? controller.currentExpression
: BotExpression.addled, : BotExpression.addled,
), ),
Expanded( Scrollbar(
child: Scrollbar( controller: scrollController,
thumbVisibility: true,
child: SingleChildScrollView(
controller: scrollController, controller: scrollController,
thumbVisibility: true, child: Column(
child: SingleChildScrollView( mainAxisAlignment: MainAxisAlignment.spaceBetween,
controller: scrollController, children: [
child: Column( // const SizedBox(height: 10.0),
mainAxisAlignment: MainAxisAlignment.spaceBetween, // if (matchCopy.description != null)
children: [ // Padding(
// const SizedBox(height: 10.0), // padding: const EdgeInsets.only(),
// if (matchCopy.description != null) // child: Text(
// Padding( // matchCopy.description!,
// padding: const EdgeInsets.only(), // style: BotStyle.text(context),
// child: Text( // ),
// matchCopy.description!, // ),
// style: BotStyle.text(context), const SizedBox(height: 8),
// ), if (!controller.widget.scm.pangeaMatch!.isITStart)
// ), ChoicesArray(
const SizedBox(height: 8), originalSpan:
if (!controller.widget.scm.pangeaMatch!.isITStart) controller.widget.scm.pangeaMatch!.matchContent,
ChoicesArray( isLoading: controller.fetchingData,
originalSpan: choices:
controller.widget.scm.pangeaMatch!.matchContent, controller.widget.scm.pangeaMatch!.match.choices
isLoading: controller.fetchingData, ?.map(
choices: (e) => Choice(
controller.widget.scm.pangeaMatch!.match.choices text: e.value,
?.map( color: e.selected ? e.type.color : null,
(e) => Choice( isGold: e.type.name == 'bestCorrection',
text: e.value, ),
color: e.selected ? e.type.color : null, )
isGold: e.type.name == 'bestCorrection', .toList(),
), onPressed: controller.onChoiceSelect,
) uniqueKeyForLayerLink: (int index) =>
.toList(), "wordMatch$index",
onPressed: controller.onChoiceSelect, selectedChoiceIndex: controller.selectedChoiceIndex,
uniqueKeyForLayerLink: (int index) => ),
"wordMatch$index", const SizedBox(height: 12),
selectedChoiceIndex: controller.selectedChoiceIndex, PromptAndFeedback(controller: controller),
), ],
const SizedBox(height: 12),
PromptAndFeedback(controller: controller),
],
),
), ),
), ),
), ),

Write Preview
Loading…
Cancel
Save