Add chat font scale setting
This commit is contained in:
parent
a03084af1c
commit
84aca5900b
6 changed files with 94 additions and 63 deletions
|
|
@ -3,8 +3,8 @@ import 'package:collection/collection.dart';
|
|||
import 'package:flutter/gestures.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
import 'package:frosty/models/badges.dart';
|
||||
import 'package:frosty/models/emotes.dart';
|
||||
import 'package:frosty/screens/channel/chat/chat_assets_store.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:url_launcher/url_launcher.dart';
|
||||
|
||||
|
|
@ -76,12 +76,7 @@ class IRCMessage {
|
|||
/// Returns an [InlineSpan] list that corresponds to the badges, username, words, and emotes of the given [IRCMessage].
|
||||
List<InlineSpan> generateSpan({
|
||||
required TextStyle? style,
|
||||
required Map<String, Emote> emoteToObject,
|
||||
required Map<String, BadgeInfoTwitch> twitchBadgeToObject,
|
||||
Map<String, List<BadgeInfoFFZ>>? ffzUserToBadges,
|
||||
Map<String, List<BadgeInfo7TV>>? sevenTVUserToBadges,
|
||||
Map<String, BadgeInfoBTTV>? bttvUserToBadge,
|
||||
RoomFFZ? ffzRoomInfo,
|
||||
required ChatAssetsStore assetsStore,
|
||||
bool showMessage = true,
|
||||
bool useZeroWidth = false,
|
||||
bool useReadableColors = false,
|
||||
|
|
@ -90,6 +85,13 @@ class IRCMessage {
|
|||
const badgeHeight = 20.0;
|
||||
const emoteHeight = 30.0;
|
||||
|
||||
final emoteToObject = assetsStore.emoteToObject;
|
||||
final twitchBadgeToObject = assetsStore.twitchBadgesToObject;
|
||||
final ffzUserToBadges = assetsStore.userToFFZBadges;
|
||||
final sevenTVUserToBadges = assetsStore.userTo7TVBadges;
|
||||
final bttvUserToBadge = assetsStore.userToBTTVBadges;
|
||||
final ffzRoomInfo = assetsStore.ffzRoomInfo;
|
||||
|
||||
// The span list that will be used to render the chat message
|
||||
final span = <InlineSpan>[];
|
||||
|
||||
|
|
@ -119,7 +121,7 @@ class IRCMessage {
|
|||
// Indicator to skip adding the bot badges later when adding the rest of FFZ badges.
|
||||
var skipBot = false;
|
||||
|
||||
final ffzUserBadges = ffzUserToBadges?[tags['user-id']];
|
||||
final ffzUserBadges = ffzUserToBadges[tags['user-id']];
|
||||
final twitchBadges = tags['badges']?.split(',');
|
||||
// Pasrse and add the Twitch badges to the span if they exist.
|
||||
if (twitchBadges != null) {
|
||||
|
|
@ -201,7 +203,7 @@ class IRCMessage {
|
|||
}
|
||||
|
||||
// Add BTTV badges to span
|
||||
final userBTTVBadge = bttvUserToBadge?[tags['user-id']];
|
||||
final userBTTVBadge = bttvUserToBadge[tags['user-id']];
|
||||
if (userBTTVBadge != null) {
|
||||
span.add(
|
||||
_createEmoteSpan(
|
||||
|
|
@ -215,7 +217,7 @@ class IRCMessage {
|
|||
}
|
||||
|
||||
// Add 7TV badges to end of badges span
|
||||
final user7TVBadges = sevenTVUserToBadges?[tags['user-id']];
|
||||
final user7TVBadges = sevenTVUserToBadges[tags['user-id']];
|
||||
if (user7TVBadges != null) {
|
||||
for (final badge in user7TVBadges) {
|
||||
span.add(
|
||||
|
|
|
|||
|
|
@ -33,44 +33,47 @@ class _ChatState extends State<Chat> {
|
|||
FocusManager.instance.primaryFocus?.unfocus();
|
||||
if (chatStore.assetsStore.showEmoteMenu) chatStore.assetsStore.showEmoteMenu = false;
|
||||
},
|
||||
child: Observer(
|
||||
builder: (context) => ListView.builder(
|
||||
addAutomaticKeepAlives: false,
|
||||
addRepaintBoundaries: false,
|
||||
itemCount: chatStore.messages.length,
|
||||
controller: chatStore.scrollController,
|
||||
itemBuilder: (context, index) => Observer(
|
||||
builder: (context) {
|
||||
final message = chatStore.messages[index];
|
||||
child: MediaQuery(
|
||||
data: MediaQuery.of(context).copyWith(textScaleFactor: chatStore.settings.fontScale),
|
||||
child: Observer(
|
||||
builder: (context) => ListView.builder(
|
||||
addAutomaticKeepAlives: false,
|
||||
addRepaintBoundaries: false,
|
||||
itemCount: chatStore.messages.length,
|
||||
controller: chatStore.scrollController,
|
||||
itemBuilder: (context, index) => Observer(
|
||||
builder: (context) {
|
||||
final message = chatStore.messages[index];
|
||||
|
||||
if (message.user != null && message.user != chatStore.auth.user.details?.login) {
|
||||
return InkWell(
|
||||
onTap: () {
|
||||
FocusManager.instance.primaryFocus?.unfocus();
|
||||
if (chatStore.assetsStore.showEmoteMenu) chatStore.assetsStore.showEmoteMenu = false;
|
||||
},
|
||||
onLongPress: () => showModalBottomSheet(
|
||||
context: context,
|
||||
builder: (context) => ChatUserModal(
|
||||
username: message.user!,
|
||||
chatStore: chatStore,
|
||||
userId: message.tags['user-id']!,
|
||||
displayName: message.tags['display-name']!,
|
||||
if (message.user != null && message.user != chatStore.auth.user.details?.login) {
|
||||
return InkWell(
|
||||
onTap: () {
|
||||
FocusManager.instance.primaryFocus?.unfocus();
|
||||
if (chatStore.assetsStore.showEmoteMenu) chatStore.assetsStore.showEmoteMenu = false;
|
||||
},
|
||||
onLongPress: () => showModalBottomSheet(
|
||||
context: context,
|
||||
builder: (context) => ChatUserModal(
|
||||
username: message.user!,
|
||||
chatStore: chatStore,
|
||||
userId: message.tags['user-id']!,
|
||||
displayName: message.tags['display-name']!,
|
||||
),
|
||||
),
|
||||
),
|
||||
child: ChatMessage(
|
||||
ircMessage: message,
|
||||
assetsStore: chatStore.assetsStore,
|
||||
settingsStore: chatStore.settings,
|
||||
),
|
||||
child: ChatMessage(
|
||||
ircMessage: message,
|
||||
assetsStore: chatStore.assetsStore,
|
||||
settingsStore: chatStore.settings,
|
||||
),
|
||||
);
|
||||
}
|
||||
return ChatMessage(
|
||||
ircMessage: message,
|
||||
assetsStore: chatStore.assetsStore,
|
||||
settingsStore: chatStore.settings,
|
||||
);
|
||||
}
|
||||
return ChatMessage(
|
||||
ircMessage: message,
|
||||
assetsStore: chatStore.assetsStore,
|
||||
settingsStore: chatStore.settings,
|
||||
);
|
||||
},
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
|
|
|||
|
|
@ -36,12 +36,7 @@ class ChatMessage extends StatelessWidget {
|
|||
TextSpan(
|
||||
children: ircMessage.generateSpan(
|
||||
style: DefaultTextStyle.of(context).style,
|
||||
emoteToObject: assetsStore.emoteToObject,
|
||||
twitchBadgeToObject: assetsStore.twitchBadgesToObject,
|
||||
ffzUserToBadges: assetsStore.userToFFZBadges,
|
||||
sevenTVUserToBadges: assetsStore.userTo7TVBadges,
|
||||
bttvUserToBadge: assetsStore.userToBTTVBadges,
|
||||
ffzRoomInfo: assetsStore.ffzRoomInfo,
|
||||
assetsStore: assetsStore,
|
||||
useZeroWidth: settingsStore.showZeroWidth,
|
||||
useReadableColors: settingsStore.useReadableColors,
|
||||
timestamp: timeStamps,
|
||||
|
|
@ -75,12 +70,7 @@ class ChatMessage extends StatelessWidget {
|
|||
TextSpan(
|
||||
children: ircMessage.generateSpan(
|
||||
style: DefaultTextStyle.of(context).style,
|
||||
emoteToObject: assetsStore.emoteToObject,
|
||||
twitchBadgeToObject: assetsStore.twitchBadgesToObject,
|
||||
ffzUserToBadges: assetsStore.userToFFZBadges,
|
||||
sevenTVUserToBadges: assetsStore.userTo7TVBadges,
|
||||
bttvUserToBadge: assetsStore.userToBTTVBadges,
|
||||
ffzRoomInfo: assetsStore.ffzRoomInfo,
|
||||
assetsStore: assetsStore,
|
||||
showMessage: settingsStore.showDeletedMessages,
|
||||
useZeroWidth: settingsStore.showZeroWidth,
|
||||
useReadableColors: settingsStore.useReadableColors,
|
||||
|
|
@ -129,12 +119,7 @@ class ChatMessage extends StatelessWidget {
|
|||
TextSpan(
|
||||
children: ircMessage.generateSpan(
|
||||
style: DefaultTextStyle.of(context).style,
|
||||
emoteToObject: assetsStore.emoteToObject,
|
||||
twitchBadgeToObject: assetsStore.twitchBadgesToObject,
|
||||
ffzUserToBadges: assetsStore.userToFFZBadges,
|
||||
sevenTVUserToBadges: assetsStore.userTo7TVBadges,
|
||||
bttvUserToBadge: assetsStore.userToBTTVBadges,
|
||||
ffzRoomInfo: assetsStore.ffzRoomInfo,
|
||||
assetsStore: assetsStore,
|
||||
useZeroWidth: settingsStore.showZeroWidth,
|
||||
useReadableColors: settingsStore.useReadableColors,
|
||||
timestamp: timeStamps,
|
||||
|
|
|
|||
|
|
@ -47,6 +47,25 @@ class ChatSettings extends StatelessWidget {
|
|||
value: settingsStore.useReadableColors,
|
||||
onChanged: (newValue) => settingsStore.useReadableColors = newValue,
|
||||
),
|
||||
ListTile(
|
||||
isThreeLine: true,
|
||||
title: Text('Font scale: ${settingsStore.fontScale.toStringAsFixed(1)}x'),
|
||||
subtitle: Column(
|
||||
children: [
|
||||
Slider.adaptive(
|
||||
value: settingsStore.fontScale,
|
||||
min: 0.5,
|
||||
max: 2.0,
|
||||
divisions: 15,
|
||||
onChanged: (newValue) => settingsStore.fontScale = newValue,
|
||||
),
|
||||
Text(
|
||||
'Hello! This is a preview for the font scale.',
|
||||
textScaleFactor: settingsStore.fontScale,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
|
|
|
|||
|
|
@ -56,6 +56,10 @@ abstract class _SettingsStoreBase with Store {
|
|||
@observable
|
||||
var useReadableColors = true;
|
||||
|
||||
@JsonKey(defaultValue: 1.0)
|
||||
@observable
|
||||
var fontScale = 1.0;
|
||||
|
||||
// Global configs
|
||||
@JsonKey(defaultValue: false)
|
||||
@observable
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ SettingsStore _$SettingsStoreFromJson(Map<String, dynamic> json) =>
|
|||
..useTwelveHourTimestamps =
|
||||
json['useTwelveHourTimestamps'] as bool? ?? false
|
||||
..useReadableColors = json['useReadableColors'] as bool? ?? true
|
||||
..fontScale = (json['fontScale'] as num?)?.toDouble() ?? 1.0
|
||||
..fullScreen = json['fullScreen'] as bool? ?? false
|
||||
..expandInfo = json['expandInfo'] as bool? ?? true;
|
||||
|
||||
|
|
@ -34,6 +35,7 @@ Map<String, dynamic> _$SettingsStoreToJson(SettingsStore instance) =>
|
|||
'showTimestamps': instance.showTimestamps,
|
||||
'useTwelveHourTimestamps': instance.useTwelveHourTimestamps,
|
||||
'useReadableColors': instance.useReadableColors,
|
||||
'fontScale': instance.fontScale,
|
||||
'fullScreen': instance.fullScreen,
|
||||
'expandInfo': instance.expandInfo,
|
||||
};
|
||||
|
|
@ -201,6 +203,21 @@ mixin _$SettingsStore on _SettingsStoreBase, Store {
|
|||
});
|
||||
}
|
||||
|
||||
final _$fontScaleAtom = Atom(name: '_SettingsStoreBase.fontScale');
|
||||
|
||||
@override
|
||||
double get fontScale {
|
||||
_$fontScaleAtom.reportRead();
|
||||
return super.fontScale;
|
||||
}
|
||||
|
||||
@override
|
||||
set fontScale(double value) {
|
||||
_$fontScaleAtom.reportWrite(value, super.fontScale, () {
|
||||
super.fontScale = value;
|
||||
});
|
||||
}
|
||||
|
||||
final _$fullScreenAtom = Atom(name: '_SettingsStoreBase.fullScreen');
|
||||
|
||||
@override
|
||||
|
|
@ -244,6 +261,7 @@ showZeroWidth: ${showZeroWidth},
|
|||
showTimestamps: ${showTimestamps},
|
||||
useTwelveHourTimestamps: ${useTwelveHourTimestamps},
|
||||
useReadableColors: ${useReadableColors},
|
||||
fontScale: ${fontScale},
|
||||
fullScreen: ${fullScreen},
|
||||
expandInfo: ${expandInfo}
|
||||
''';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue