2136 activity suggestions feedback (#2147)

* chore: some activity page styling

* chore: add right padding to pressable button widget

* chore: don't add to stream if closed
This commit is contained in:
ggurdin 2025-03-17 10:57:40 -04:00 committed by GitHub
parent 91000fd24b
commit 91699dda04
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 108 additions and 54 deletions

View file

@ -4812,5 +4812,6 @@
"createOwnChat": "Create your own chat",
"pleaseEnterInt": "Please enter a number",
"home": "Home",
"join": "Join"
"join": "Join",
"learnByTexting": "Learn by texting"
}

View file

@ -30,7 +30,6 @@ import 'package:fluffychat/pages/settings_password/settings_password.dart';
import 'package:fluffychat/pages/settings_security/settings_security.dart';
import 'package:fluffychat/pages/settings_style/settings_style.dart';
import 'package:fluffychat/pangea/activity_planner/activity_planner_page.dart';
import 'package:fluffychat/pangea/activity_suggestions/activity_suggestions_area.dart';
import 'package:fluffychat/pangea/activity_suggestions/suggestions_page.dart';
import 'package:fluffychat/pangea/guard/p_vguard.dart';
import 'package:fluffychat/pangea/layouts/bottom_nav_layout.dart';
@ -198,7 +197,7 @@ abstract class AppRoutes {
FluffyThemes.isColumnMode(context)
// #Pangea
// ? const EmptyPage()
? const ActivitySuggestionsArea()
? const SuggestionsPage()
// Pangea#
: ChatList(
activeChat: state.pathParameters['roomid'],
@ -353,7 +352,7 @@ abstract class AppRoutes {
FluffyThemes.isColumnMode(context)
// #Pangea
// ? const EmptyPage()
? const ActivitySuggestionsArea()
? const SuggestionsPage()
// Pangea#
: const Settings(),
),

View file

@ -526,7 +526,7 @@ class ChatController extends State<ChatPageWithRoom>
if (state == AppLifecycleState.paused) {
clearSelectedEvents();
}
if (state == AppLifecycleState.hidden) {
if (state == AppLifecycleState.hidden && !stopAudioStream.isClosed) {
stopAudioStream.add(null);
}
// Pangea#

View file

@ -355,7 +355,7 @@ class ActivitySuggestionDialogState extends State<ActivitySuggestionDialog> {
),
decoration: BoxDecoration(
color: theme.colorScheme.primary
.withAlpha(50),
.withAlpha(20),
borderRadius:
BorderRadius.circular(24.0),
),
@ -402,7 +402,7 @@ class ActivitySuggestionDialogState extends State<ActivitySuggestionDialog> {
),
decoration: BoxDecoration(
color: theme.colorScheme.primary
.withAlpha(50),
.withAlpha(20),
borderRadius:
BorderRadius.circular(24.0),
),

View file

@ -38,15 +38,17 @@ class ActivitySuggestionsAreaState extends State<ActivitySuggestionsArea> {
super.dispose();
}
bool get _isColumnMode => FluffyThemes.isColumnMode(context);
final List<ActivityPlanModel> _activityItems = [];
final ScrollController _scrollController = ScrollController();
final double cardHeight = 235.0;
final double cardPadding = 8.0;
double get cardWidth => FluffyThemes.isColumnMode(context) ? 225.0 : 160.0;
double get cardWidth => _isColumnMode ? 225.0 : 160.0;
void _scrollToItem(int index) {
final viewportDimension = _scrollController.position.viewportDimension;
final double scrollOffset = FluffyThemes.isColumnMode(context)
final double scrollOffset = _isColumnMode
? index * cardWidth - (viewportDimension / 2) + (cardWidth / 2)
: (index + 1) * (cardHeight + 8.0);
final maxScrollExtent = _scrollController.position.maxScrollExtent;
@ -63,8 +65,7 @@ class ActivitySuggestionsAreaState extends State<ActivitySuggestionsArea> {
void _scrollToNextItem(AxisDirection direction) {
final currentOffset = _scrollController.offset;
final scrollAmount =
FluffyThemes.isColumnMode(context) ? cardWidth : cardHeight;
final scrollAmount = _isColumnMode ? cardWidth : cardHeight;
_scrollController.animateTo(
(direction == AxisDirection.left
@ -133,16 +134,13 @@ class ActivitySuggestionsAreaState extends State<ActivitySuggestionsArea> {
alignment: Alignment.topCenter,
padding: EdgeInsets.symmetric(
vertical: 16.0,
horizontal: FluffyThemes.isColumnMode(context) ? 16.0 : 0.0,
horizontal: _isColumnMode ? 16.0 : 0.0,
),
height: FluffyThemes.isColumnMode(context)
? cardHeight + 2 * cardPadding + 16.0
: null,
child: FluffyThemes.isColumnMode(context)
height: _isColumnMode ? cardHeight * 1.5 : null,
child: _isColumnMode
? Stack(
alignment: Alignment.center,
children: [
// Main content
Padding(
padding: const EdgeInsets.symmetric(
horizontal: 45.0,
@ -158,7 +156,7 @@ class ActivitySuggestionsAreaState extends State<ActivitySuggestionsArea> {
// Left button
Positioned(
left: 0,
top: cardHeight / 2 - 20.0,
top: cardHeight / 1.5 - 20.0,
child: Container(
decoration: BoxDecoration(
color: Theme.of(context)
@ -179,7 +177,7 @@ class ActivitySuggestionsAreaState extends State<ActivitySuggestionsArea> {
// Right button
Positioned(
right: 0,
top: cardHeight / 2 - 20.0,
top: cardHeight / 1.5 - 20.0,
child: Container(
decoration: BoxDecoration(
color: Theme.of(context)
@ -200,7 +198,7 @@ class ActivitySuggestionsAreaState extends State<ActivitySuggestionsArea> {
// Create Chat button
Positioned(
right: 0,
top: cardHeight / 2 + 30.0,
top: cardHeight / 1.5 + 30.0,
child: Container(
decoration: BoxDecoration(
color: Theme.of(context)

View file

@ -1,29 +1,77 @@
import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/l10n.dart';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/config/themes.dart';
import 'package:fluffychat/pangea/activity_suggestions/activity_suggestions_area.dart';
import 'package:fluffychat/pangea/analytics_summary/learning_progress_indicators.dart';
import 'package:fluffychat/pangea/common/widgets/pangea_logo_svg.dart';
class SuggestionsPage extends StatelessWidget {
const SuggestionsPage({super.key});
@override
Widget build(BuildContext context) {
return const Scaffold(
body: SafeArea(
child: Column(
children: [
Padding(
padding: EdgeInsets.only(
top: 16,
left: 16,
right: 16,
final theme = Theme.of(context);
return Padding(
padding: EdgeInsets.symmetric(
horizontal: FluffyThemes.isColumnMode(context) ? 36.0 : 8.0,
vertical: 24.0,
),
child: Scaffold(
appBar: AppBar(
automaticallyImplyLeading: false,
title: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
L10n.of(context).learnByTexting,
style: const TextStyle(fontWeight: FontWeight.bold),
),
child: LearningProgressIndicators(),
),
Expanded(
child: ActivitySuggestionsArea(),
),
],
Container(
decoration: BoxDecoration(
color: theme.colorScheme.surfaceContainerHighest,
borderRadius: BorderRadius.circular(36.0),
),
padding: const EdgeInsets.symmetric(
vertical: 8.0,
horizontal: 16.0,
),
child: Row(
spacing: 8.0,
children: [
PangeaLogoSvg(
width: 24.0,
forceColor: theme.colorScheme.primary,
),
Text(
AppConfig.applicationName,
style: theme.textTheme.titleMedium?.copyWith(
fontWeight: FontWeight.bold,
),
),
],
),
),
],
),
),
body: SafeArea(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
if (!FluffyThemes.isColumnMode(context))
const Padding(
padding: EdgeInsets.all(24.0),
child: LearningProgressIndicators(),
),
const SizedBox(height: 16.0),
const Flexible(
child: ActivitySuggestionsArea(),
),
],
),
),
),
);

View file

@ -144,34 +144,42 @@ class PressableButtonState extends State<PressableButton>
child: AnimatedBuilder(
animation: _tweenAnimation,
builder: (context, child) {
return Column(
return Row(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(height: _tweenAnimation.value),
Container(
decoration: BoxDecoration(
color: Color.alphaBlend(
Colors.black.withAlpha(70),
widget.color,
),
borderRadius: widget.borderRadius,
Flexible(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(height: _tweenAnimation.value),
Container(
decoration: BoxDecoration(
color: Color.alphaBlend(
Colors.black.withAlpha(70),
widget.color,
),
borderRadius: widget.borderRadius,
),
padding: EdgeInsets.only(
bottom: !_depressed
? widget.buttonHeight - _tweenAnimation.value
: 0,
right: !_depressed
? (widget.buttonHeight - _tweenAnimation.value) /
2
: 0,
),
child: child,
),
],
),
padding: EdgeInsets.only(
bottom: !_depressed
? widget.buttonHeight - _tweenAnimation.value
: 0,
),
child: child,
),
SizedBox(height: _tweenAnimation.value / 2),
],
);
},
child: Container(
decoration: BoxDecoration(
// color: Color.alphaBlend(
// Colors.white.withAlpha(250),
// widget.color,
// ),
borderRadius: widget.borderRadius,
),
child: widget.child,