GitLab/fluffychat
2
0
Fork 0
mirror of https://gitlab.com/famedly/fluffychat.git synced 2025-01-11 18:22:49 +01:00
Code Issues Projects Releases Wiki Activity

design: Improve create story page design

Browse Source
This commit is contained in:
Christian Pauly 2022-02-05 09:58:47 +01:00 committed by Krille Fear
parent 6dae4cca94
commit 566b9155d1
2 changed files with 69 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
lib/pages/add_story/add_story.dart
View File

@ -1,3 +1,4 @@
import 'dart:async';
import 'dart:io';
import 'package:flutter/material.dart';
@ -35,12 +36,25 @@ class AddStoryController extends State<AddStoryPage> {
bool get hasMedia => image != null || video != null;
void updateColors() => hasMedia
? null
: setState(() {
backgroundColor = controller.text.color;
backgroundColorDark = controller.text.darkColor;
});
bool hasText = false;
Timer? _updateColorsCooldown;
void updateColors() {
if (hasText != controller.text.isNotEmpty) {
setState(() {
hasText = controller.text.isNotEmpty;
});
}
_updateColorsCooldown?.cancel();
_updateColorsCooldown = Timer(
const Duration(seconds: 3),
() => setState(() {
backgroundColor = controller.text.color;
backgroundColorDark = controller.text.darkColor;
}),
);
}
void importMedia() async {
final picked = await FilePickerCross.importFromStorage(
@ -88,6 +102,11 @@ class AddStoryController extends State<AddStoryPage> {
});
}
void reset() => setState(() {
image = video = null;
controller.clear();
});
void postStory() async {
if (video == null && image == null && controller.text.isEmpty) return;
final client = Matrix.of(context).client;
@ -150,7 +169,6 @@ class AddStoryController extends State<AddStoryPage> {
backgroundColorDark = text.darkColor;
final shareContent = Matrix.of(context).shareContent;
// ignore: unnecessary_null_comparison
if (shareContent != null) {
final shareFile = shareContent.tryGet<MatrixFile>('file')?.detectFileType;

70
lib/pages/add_story/add_story_view.dart
View File

@ -4,7 +4,6 @@ import 'package:flutter/services.dart';
import 'package:flutter_gen/gen_l10n/l10n.dart';
import 'package:video_player/video_player.dart';
import 'package:fluffychat/utils/platform_infos.dart';
import 'add_story.dart';
class AddStoryView extends StatelessWidget {
@ -34,24 +33,13 @@ class AddStoryView extends StatelessWidget {
],
),
),
actions: controller.hasMedia
? null
: [
IconButton(
icon: const Icon(Icons.photo_outlined),
onPressed: controller.importMedia,
),
if (PlatformInfos.isMobile)
IconButton(
icon: const Icon(Icons.camera_alt_outlined),
onPressed: controller.capturePhoto,
),
if (PlatformInfos.isMobile)
IconButton(
icon: const Icon(Icons.video_camera_back_outlined),
onPressed: controller.captureVideo,
),
],
actions: [
if (controller.hasMedia)
IconButton(
icon: const Icon(Icons.delete_outlined),
onPressed: controller.reset,
),
],
),
extendBodyBehindAppBar: true,
body: Stack(
@ -104,7 +92,7 @@ class AddStoryView extends StatelessWidget {
? null
: Colors.black.withOpacity(0.5),
),
onEditingComplete: controller.updateColors,
onChanged: (_) => controller.updateColors(),
decoration: InputDecoration(
border: InputBorder.none,
hintText: controller.hasMedia
@ -123,12 +111,42 @@ class AddStoryView extends StatelessWidget {
),
],
),
floatingActionButton: FloatingActionButton.extended(
onPressed: controller.postStory,
label: Text(L10n.of(context)!.publish),
backgroundColor: Theme.of(context).colorScheme.surface,
foregroundColor: Theme.of(context).colorScheme.onSurface,
icon: const Icon(Icons.send_rounded),
floatingActionButton: Column(
mainAxisSize: MainAxisSize.min,
children: [
FloatingActionButton(
onPressed: controller.captureVideo,
backgroundColor: controller.backgroundColorDark,
foregroundColor: Colors.white,
heroTag: null,
child: const Icon(Icons.video_camera_front_outlined),
),
const SizedBox(height: 16),
FloatingActionButton(
onPressed: controller.capturePhoto,
backgroundColor: controller.backgroundColorDark,
foregroundColor: Colors.white,
heroTag: null,
child: const Icon(Icons.camera_alt_outlined),
),
const SizedBox(height: 16),
FloatingActionButton(
onPressed: controller.importMedia,
backgroundColor: controller.backgroundColorDark,
foregroundColor: Colors.white,
heroTag: null,
child: const Icon(Icons.photo_outlined),
),
if (controller.hasMedia || controller.hasText) ...[
const SizedBox(height: 16),
FloatingActionButton(
onPressed: controller.postStory,
backgroundColor: Theme.of(context).colorScheme.surface,
foregroundColor: Theme.of(context).colorScheme.onSurface,
child: const Icon(Icons.send_rounded),
),
],
],
),
);
}