Merge pull request #841 from krille-chan/krille/new-wallpaper

feat: New account data wallpaper feature
This commit is contained in:
Krille-chan 2024-01-31 09:01:04 +01:00 committed by GitHub
commit 21af30e4c5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
11 changed files with 262 additions and 34 deletions

View file

@ -2462,5 +2462,6 @@
"placeholders": {
"sender": {}
}
}
},
"transparent": "Transparent"
}

View file

@ -21,6 +21,6 @@
<key>CFBundleVersion</key>
<string>1.0</string>
<key>MinimumOSVersion</key>
<string>11.0</string>
<string>12.0</string>
</dict>
</plist>

View file

@ -457,7 +457,7 @@
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 11.0;
IPHONEOS_DEPLOYMENT_TARGET = 12.0;
MTL_ENABLE_DEBUG_INFO = NO;
SDKROOT = iphoneos;
SUPPORTED_PLATFORMS = iphoneos;
@ -546,7 +546,7 @@
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 11.0;
IPHONEOS_DEPLOYMENT_TARGET = 12.0;
MTL_ENABLE_DEBUG_INFO = YES;
ONLY_ACTIVE_ARCH = YES;
SDKROOT = iphoneos;
@ -595,7 +595,7 @@
GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
GCC_WARN_UNUSED_FUNCTION = YES;
GCC_WARN_UNUSED_VARIABLE = YES;
IPHONEOS_DEPLOYMENT_TARGET = 11.0;
IPHONEOS_DEPLOYMENT_TARGET = 12.0;
MTL_ENABLE_DEBUG_INFO = NO;
SDKROOT = iphoneos;
SUPPORTED_PLATFORMS = iphoneos;

View file

@ -37,7 +37,6 @@ class ChatAppBarTitle extends StatelessWidget {
MatrixLocals(L10n.of(context)!),
),
size: 32,
presenceUserId: room.directChatMatrixID,
),
),
const SizedBox(width: 12),

View file

@ -9,6 +9,7 @@ import 'package:fluffychat/pages/chat/events/message.dart';
import 'package:fluffychat/pages/chat/seen_by_row.dart';
import 'package:fluffychat/pages/chat/typing_indicators.dart';
import 'package:fluffychat/pages/user_bottom_sheet/user_bottom_sheet.dart';
import 'package:fluffychat/utils/account_config.dart';
import 'package:fluffychat/utils/adaptive_bottom_sheet.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions/filtered_timeline_extension.dart';
import 'package:fluffychat/utils/platform_infos.dart';
@ -36,6 +37,9 @@ class ChatEventList extends StatelessWidget {
thisEventsKeyMap[events[i].eventId] = i;
}
final hasWallpaper =
controller.room.client.applicationAccountConfig.wallpaperUrl != null;
return SelectionArea(
child: ListView.custom(
padding: EdgeInsets.only(
@ -140,6 +144,8 @@ class ChatEventList extends StatelessWidget {
controller.readMarkerEventId == event.eventId &&
controller.timeline?.allowNewEvent == false,
nextEvent: i + 1 < events.length ? events[i + 1] : null,
avatarPresenceBackgroundColor:
hasWallpaper ? Colors.transparent : null,
),
);
},

View file

@ -16,9 +16,11 @@ import 'package:fluffychat/pages/chat/pinned_events.dart';
import 'package:fluffychat/pages/chat/reactions_picker.dart';
import 'package:fluffychat/pages/chat/reply_display.dart';
import 'package:fluffychat/pages/chat/tombstone_display.dart';
import 'package:fluffychat/utils/account_config.dart';
import 'package:fluffychat/widgets/chat_settings_popup_menu.dart';
import 'package:fluffychat/widgets/connection_status_header.dart';
import 'package:fluffychat/widgets/matrix.dart';
import 'package:fluffychat/widgets/mxc_image.dart';
import 'package:fluffychat/widgets/unread_rooms_badge.dart';
import '../../utils/stream_extension.dart';
import 'chat_emoji_picker.dart';
@ -136,6 +138,8 @@ class ChatView extends StatelessWidget {
final bottomSheetPadding = FluffyThemes.isColumnMode(context) ? 16.0 : 8.0;
final scrollUpBannerEventId = controller.scrollUpBannerEventId;
final accountConfig = Matrix.of(context).client.applicationAccountConfig;
return PopScope(
canPop: controller.selectedEvents.isEmpty && !controller.showEmojiPicker,
onPopInvoked: (pop) async {
@ -198,6 +202,18 @@ class ChatView extends StatelessWidget {
onDragExited: controller.onDragExited,
child: Stack(
children: <Widget>[
if (accountConfig.wallpaperUrl != null)
Opacity(
opacity: accountConfig.wallpaperOpacity ?? 1,
child: MxcImage(
uri: accountConfig.wallpaperUrl,
fit: BoxFit.cover,
isThumbnail: true,
width: FluffyThemes.columnWidth * 2,
height: MediaQuery.of(context).size.height,
placeholder: (_) => Container(),
),
),
SafeArea(
child: Column(
children: <Widget>[
@ -300,8 +316,9 @@ class ChatView extends StatelessWidget {
children: [
TextButton.icon(
style: TextButton.styleFrom(
padding:
const EdgeInsets.all(16),
padding: const EdgeInsets.all(
16,
),
foregroundColor:
Theme.of(context)
.colorScheme
@ -317,8 +334,9 @@ class ChatView extends StatelessWidget {
),
TextButton.icon(
style: TextButton.styleFrom(
padding:
const EdgeInsets.all(16),
padding: const EdgeInsets.all(
16,
),
),
icon: const Icon(
Icons.forum_outlined,

View file

@ -33,6 +33,7 @@ class Message extends StatelessWidget {
final bool highlightMarker;
final bool animateIn;
final void Function()? resetAnimateIn;
final Color? avatarPresenceBackgroundColor;
const Message(
this.event, {
@ -49,6 +50,7 @@ class Message extends StatelessWidget {
this.highlightMarker = false,
this.animateIn = false,
this.resetAnimateIn,
this.avatarPresenceBackgroundColor,
super.key,
});
@ -177,6 +179,7 @@ class Message extends StatelessWidget {
mxContent: user.avatarUrl,
name: user.calcDisplayname(),
presenceUserId: user.stateKey,
presenceBackgroundColor: avatarPresenceBackgroundColor,
onTap: () => onAvatarTab(event),
);
},

View file

@ -1,7 +1,12 @@
import 'package:flutter/material.dart';
import 'package:file_picker/file_picker.dart';
import 'package:future_loading_dialog/future_loading_dialog.dart';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/config/setting_keys.dart';
import 'package:fluffychat/utils/account_config.dart';
import 'package:fluffychat/widgets/app_lock.dart';
import 'package:fluffychat/widgets/theme_builder.dart';
import '../../widgets/matrix.dart';
import 'settings_style_view.dart';
@ -19,6 +24,51 @@ class SettingsStyleController extends State<SettingsStyle> {
ThemeController.of(context).setPrimaryColor(color);
}
void setWallpaper() async {
final client = Matrix.of(context).client;
final picked = await AppLock.of(context).pauseWhile(
FilePicker.platform.pickFiles(
type: FileType.image,
withData: true,
),
);
final pickedFile = picked?.files.firstOrNull;
if (pickedFile == null) return;
await showFutureLoadingDialog(
context: context,
future: () async {
final url = await client.uploadContent(
pickedFile.bytes!,
filename: pickedFile.name,
);
await client.updateApplicationAccountConfig(
ApplicationAccountConfig(wallpaperUrl: url),
);
},
);
}
void setChatWallpaperOpacity(double opacity) {
final client = Matrix.of(context).client;
showFutureLoadingDialog(
context: context,
future: () => client.updateApplicationAccountConfig(
ApplicationAccountConfig(wallpaperOpacity: opacity),
),
);
}
void deleteChatWallpaper() => showFutureLoadingDialog(
context: context,
future: () => Matrix.of(context).client.setApplicationAccountConfig(
const ApplicationAccountConfig(
wallpaperUrl: null,
wallpaperOpacity: null,
),
),
);
ThemeMode get currentTheme => ThemeController.of(context).themeMode;
Color? get currentColor => ThemeController.of(context).primaryColor;

View file

@ -3,7 +3,11 @@ import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/l10n.dart';
import 'package:fluffychat/config/themes.dart';
import 'package:fluffychat/utils/account_config.dart';
import 'package:fluffychat/widgets/avatar.dart';
import 'package:fluffychat/widgets/layouts/max_width_body.dart';
import 'package:fluffychat/widgets/matrix.dart';
import 'package:fluffychat/widgets/mxc_image.dart';
import '../../config/app_config.dart';
import 'settings_style.dart';
@ -15,6 +19,7 @@ class SettingsStyleView extends StatelessWidget {
@override
Widget build(BuildContext context) {
const colorPickerSize = 32.0;
final client = Matrix.of(context).client;
return Scaffold(
appBar: AppBar(
leading: const Center(child: BackButton()),
@ -166,27 +171,104 @@ class SettingsStyleView extends StatelessWidget {
),
),
),
Container(
alignment: Alignment.centerLeft,
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Material(
color: Theme.of(context).colorScheme.primaryContainer,
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
child: Text(
'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor',
style: TextStyle(
color: Theme.of(context).colorScheme.onPrimaryContainer,
fontSize:
AppConfig.messageFontSize * AppConfig.fontSizeFactor,
),
),
),
StreamBuilder(
stream: client.onAccountData.stream.where(
(data) =>
data.type ==
ApplicationAccountConfigExtension.accountDataKey,
),
builder: (context, snapshot) {
final accountConfig = client.applicationAccountConfig;
final wallpaperOpacity = accountConfig.wallpaperOpacity ?? 1;
final wallpaperOpacityIsDefault = wallpaperOpacity == 1;
return Column(
mainAxisSize: MainAxisSize.min,
children: [
AnimatedContainer(
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
alignment: Alignment.centerLeft,
decoration: const BoxDecoration(),
clipBehavior: Clip.hardEdge,
child: Stack(
children: [
if (accountConfig.wallpaperUrl != null)
Opacity(
opacity: wallpaperOpacity,
child: MxcImage(
uri: accountConfig.wallpaperUrl,
fit: BoxFit.cover,
isThumbnail: true,
width: FluffyThemes.columnWidth * 2,
height: 156,
),
),
Padding(
padding: EdgeInsets.only(
left: 12 + 12 + Avatar.defaultSize,
right: 12,
top: accountConfig.wallpaperUrl == null ? 0 : 12,
bottom: 12,
),
child: Material(
color: Theme.of(context)
.colorScheme
.primaryContainer,
borderRadius: BorderRadius.circular(
AppConfig.borderRadius,
),
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 16,
vertical: 8,
),
child: Text(
'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor',
style: TextStyle(
color: Theme.of(context)
.colorScheme
.onPrimaryContainer,
fontSize: AppConfig.messageFontSize *
AppConfig.fontSizeFactor,
),
),
),
),
),
],
),
),
ListTile(
title: Text(L10n.of(context)!.wallpaper),
leading: const Icon(Icons.photo_outlined),
trailing: accountConfig.wallpaperUrl == null
? null
: IconButton(
icon: const Icon(Icons.delete_outlined),
color: Theme.of(context).colorScheme.error,
onPressed: controller.deleteChatWallpaper,
),
onTap: controller.setWallpaper,
),
AnimatedSize(
duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve,
child: accountConfig.wallpaperUrl != null
? SwitchListTile.adaptive(
title: Text(L10n.of(context)!.transparent),
secondary: const Icon(Icons.blur_linear_outlined),
value: !wallpaperOpacityIsDefault,
onChanged: (_) =>
controller.setChatWallpaperOpacity(
wallpaperOpacityIsDefault ? 0.4 : 1,
),
)
: null,
),
],
);
},
),
ListTile(
title: Text(L10n.of(context)!.fontSize),

View file

@ -0,0 +1,65 @@
import 'package:matrix/matrix.dart';
extension ApplicationAccountConfigExtension on Client {
static const String accountDataKey = 'im.fluffychat.account_config';
ApplicationAccountConfig get applicationAccountConfig =>
ApplicationAccountConfig.fromJson(
accountData[accountDataKey]?.content ?? {},
);
Future<void> setApplicationAccountConfig(
ApplicationAccountConfig config,
) =>
setAccountData(
userID!,
accountDataKey,
config.toJson(),
);
/// Only updates the specified values in ApplicationAccountConfig
Future<void> updateApplicationAccountConfig(
ApplicationAccountConfig config,
) {
final currentConfig = applicationAccountConfig;
return setAccountData(
userID!,
accountDataKey,
ApplicationAccountConfig(
wallpaperUrl: config.wallpaperUrl ?? currentConfig.wallpaperUrl,
wallpaperOpacity:
config.wallpaperOpacity ?? currentConfig.wallpaperOpacity,
).toJson(),
);
}
}
class ApplicationAccountConfig {
final Uri? wallpaperUrl;
final double? wallpaperOpacity;
const ApplicationAccountConfig({
this.wallpaperUrl,
this.wallpaperOpacity,
});
static double _sanitizedOpacity(double? opacity) {
if (opacity == null) return 1;
if (opacity > 1 || opacity < 0) return 1;
return opacity;
}
factory ApplicationAccountConfig.fromJson(Map<String, dynamic> json) =>
ApplicationAccountConfig(
wallpaperUrl: json['wallpaper_url'] is String
? Uri.tryParse(json['wallpaper_url'])
: null,
wallpaperOpacity:
_sanitizedOpacity(json.tryGet<double>('wallpaper_opacity')),
);
Map<String, dynamic> toJson() => {
'wallpaper_url': wallpaperUrl?.toString(),
'wallpaper_opacity': wallpaperOpacity,
};
}

View file

@ -92,8 +92,8 @@ class Avatar extends StatelessWidget {
? Colors.orange
: Colors.grey;
return Positioned(
bottom: -4,
right: -4,
bottom: -3,
right: -3,
child: Container(
width: 16,
height: 16,
@ -104,11 +104,15 @@ class Avatar extends StatelessWidget {
),
alignment: Alignment.center,
child: Container(
width: 8,
height: 8,
width: 10,
height: 10,
decoration: BoxDecoration(
color: dotColor,
borderRadius: BorderRadius.circular(16),
border: Border.all(
width: 1,
color: Theme.of(context).colorScheme.background,
),
),
),
),