use a function for textPatternStyle and add default to theme

This commit is contained in:
Salvatore Giordano
2022-01-03 09:20:47 +01:00
parent e85b1a8b3f
commit fbf8694f58
4 changed files with 34 additions and 11 deletions
@@ -17,7 +17,7 @@ class MessageInputController extends ValueNotifier<Message> {
/// message.
factory MessageInputController({
Message? message,
Map<RegExp, TextStyle>? textPatternStyle,
Map<RegExp, TextStyleBuilder>? textPatternStyle,
}) =>
MessageInputController._(
initialMessage: message ?? Message(),
@@ -27,7 +27,7 @@ class MessageInputController extends ValueNotifier<Message> {
/// Creates a controller for an editable text field from an initial [text].
factory MessageInputController.fromText(
String? text, {
Map<RegExp, TextStyle>? textPatternStyle,
Map<RegExp, TextStyleBuilder>? textPatternStyle,
}) =>
MessageInputController._(
initialMessage: Message(text: text),
@@ -38,7 +38,7 @@ class MessageInputController extends ValueNotifier<Message> {
/// [attachments].
factory MessageInputController.fromAttachments(
List<Attachment> attachments, {
Map<RegExp, TextStyle>? textPatternStyle,
Map<RegExp, TextStyleBuilder>? textPatternStyle,
}) =>
MessageInputController._(
initialMessage: Message(attachments: attachments),
@@ -47,7 +47,7 @@ class MessageInputController extends ValueNotifier<Message> {
MessageInputController._({
required Message initialMessage,
Map<RegExp, TextStyle>? textPatternStyle,
Map<RegExp, TextStyleBuilder>? textPatternStyle,
}) : _textEditingController = MessageTextFieldController.fromValue(
initialMessage.text == null
? const TextEditingValue()
@@ -1,4 +1,8 @@
import 'package:flutter/material.dart';
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
/// A function that takes a [BuildContext] and returns a [TextStyle].
typedef TextStyleBuilder = TextStyle Function(BuildContext context);
/// Controller for the [StreamTextField] widget.
class MessageTextFieldController extends TextEditingController {
@@ -15,7 +19,7 @@ class MessageTextFieldController extends TextEditingController {
}) : super.fromValue(value);
/// A map of style to apply to the text matching the RegExp patterns.
final Map<RegExp, TextStyle>? textPatternStyle;
final Map<RegExp, TextStyleBuilder>? textPatternStyle;
/// Builds a [TextSpan] from the current text,
/// highlighting the matches for [textPatternStyle].
@@ -25,8 +29,14 @@ class MessageTextFieldController extends TextEditingController {
TextStyle? style,
required bool withComposing,
}) {
final pattern = textPatternStyle;
if (pattern == null) {
final pattern = textPatternStyle ??
{
RegExp(r'(?:(?:https?|ftp):\/\/)?[\w/\-?=%.]+\.[\w/\-?=%.]+'):
(context) => TextStyle(
color: MessageInputTheme.of(context).linkHighlightColor,
),
};
if (pattern.isEmpty) {
return super.buildTextSpan(
context: context,
style: style,
@@ -41,7 +51,7 @@ class MessageTextFieldController extends TextEditingController {
final key = pattern.keys.firstWhere((it) => it.hasMatch(text));
return TextSpan(
text: text,
style: pattern[key],
style: pattern[key]?.call(context),
);
},
);
@@ -259,6 +259,7 @@ class StreamChatThemeData {
sendButtonIdleColor: colorTheme.disabled,
inputBackgroundColor: colorTheme.barsBg,
inputTextStyle: textTheme.body,
linkHighlightColor: colorTheme.accentPrimary,
idleBorderGradient: LinearGradient(
colors: [
colorTheme.disabled,
@@ -65,6 +65,7 @@ class MessageInputThemeData with Diagnosticable {
this.idleBorderGradient,
this.borderRadius,
this.expandButtonColor,
this.linkHighlightColor,
});
/// Duration of the [MessageInput] send button animation
@@ -73,6 +74,9 @@ class MessageInputThemeData with Diagnosticable {
/// Background color of [MessageInput] send button
final Color? sendButtonColor;
/// Color of a link
final Color? linkHighlightColor;
/// Background color of [MessageInput] action buttons
final Color? actionButtonColor;
@@ -110,6 +114,7 @@ class MessageInputThemeData with Diagnosticable {
Color? actionButtonColor,
Color? sendButtonColor,
Color? actionButtonIdleColor,
Color? linkHighlightColor,
Color? sendButtonIdleColor,
Color? expandButtonColor,
TextStyle? inputTextStyle,
@@ -133,6 +138,7 @@ class MessageInputThemeData with Diagnosticable {
activeBorderGradient: activeBorderGradient ?? this.activeBorderGradient,
idleBorderGradient: idleBorderGradient ?? this.idleBorderGradient,
borderRadius: borderRadius ?? this.borderRadius,
linkHighlightColor: linkHighlightColor ?? this.linkHighlightColor,
);
/// Linearly interpolate from one [MessageInputThemeData] to another.
@@ -161,6 +167,8 @@ class MessageInputThemeData with Diagnosticable {
Color.lerp(a.sendButtonIdleColor, b.sendButtonIdleColor, t),
sendAnimationDuration: a.sendAnimationDuration,
inputDecoration: a.inputDecoration,
linkHighlightColor:
Color.lerp(a.linkHighlightColor, b.linkHighlightColor, t),
);
/// Merges [this] [MessageInputThemeData] with the [other]
@@ -181,6 +189,7 @@ class MessageInputThemeData with Diagnosticable {
idleBorderGradient: other.idleBorderGradient,
borderRadius: other.borderRadius,
expandButtonColor: other.expandButtonColor,
linkHighlightColor: other.linkHighlightColor,
);
}
@@ -200,7 +209,8 @@ class MessageInputThemeData with Diagnosticable {
inputDecoration == other.inputDecoration &&
idleBorderGradient == other.idleBorderGradient &&
activeBorderGradient == other.activeBorderGradient &&
borderRadius == other.borderRadius;
borderRadius == other.borderRadius &&
linkHighlightColor == other.linkHighlightColor;
@override
int get hashCode =>
@@ -215,7 +225,8 @@ class MessageInputThemeData with Diagnosticable {
inputDecoration.hashCode ^
idleBorderGradient.hashCode ^
activeBorderGradient.hashCode ^
borderRadius.hashCode;
borderRadius.hashCode ^
linkHighlightColor.hashCode;
@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
@@ -232,6 +243,7 @@ class MessageInputThemeData with Diagnosticable {
..add(DiagnosticsProperty('activeBorderGradient', activeBorderGradient))
..add(DiagnosticsProperty('idleBorderGradient', idleBorderGradient))
..add(DiagnosticsProperty('borderRadius', borderRadius))
..add(ColorProperty('expandButtonColor', expandButtonColor));
..add(ColorProperty('expandButtonColor', expandButtonColor))
..add(ColorProperty('linkHighlightColor', linkHighlightColor));
}
}