diff --git a/CHANGELOG.md b/CHANGELOG.md index 91436897..5690f5a9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,7 @@ ## [2.3.1] +* **Feat**: [251](https://github.com/SimformSolutionsPvtLtd/flutter_chatview/issues/251) Add + support to provide a type of suggestions item(Scrollable or New Line). * **Fix**: [282](https://github.com/SimformSolutionsPvtLtd/flutter_chatview/pull/282) Upgrade version of audio wave forms 1.2.0 * **Fix**: [276](https://github.com/SimformSolutionsPvtLtd/flutter_chatview/issues/276) link preview diff --git a/README.md b/README.md index 701b3870..cf06e183 100644 --- a/README.md +++ b/README.md @@ -1025,6 +1025,21 @@ ChatView( ), ``` + +36. Use `suggestionItemType` to displays a suggestion items in new line and not in scrollable form. + + +```dart +ChatView( + ... + replySuggestionsConfig: ReplySuggestionsConfig( + suggestionItemType: SuggestionItemsType.newLine, + ), + ... +), +``` + + ## How to use Check out [blog](https://medium.com/simform-engineering/chatview-a-cutting-edge-chat-ui-solution-7367b1f9d772) for better understanding and basic implementation. diff --git a/lib/src/models/config_models/reply_suggestions_config.dart b/lib/src/models/config_models/reply_suggestions_config.dart index 2d6f3af5..0ea5c9bc 100644 --- a/lib/src/models/config_models/reply_suggestions_config.dart +++ b/lib/src/models/config_models/reply_suggestions_config.dart @@ -1,6 +1,7 @@ import 'package:chatview/src/models/data_models/suggestion_item_data.dart'; import 'package:flutter/material.dart'; +import '../../values/enumeration.dart'; import 'suggestion_item_config.dart'; import 'suggestion_list_config.dart'; @@ -9,11 +10,15 @@ class ReplySuggestionsConfig { final SuggestionListConfig? listConfig; final ValueSetter? onTap; final bool autoDismissOnSelection; + final SuggestionItemsType suggestionItemType; + final double spaceBetweenSuggestionItemRow; const ReplySuggestionsConfig({ this.listConfig, this.itemConfig, this.onTap, this.autoDismissOnSelection = true, + this.suggestionItemType = SuggestionItemsType.scrollable, + this.spaceBetweenSuggestionItemRow = 10, }); } diff --git a/lib/src/values/enumeration.dart b/lib/src/values/enumeration.dart index 85fac9e7..9d17402f 100644 --- a/lib/src/values/enumeration.dart +++ b/lib/src/values/enumeration.dart @@ -143,3 +143,12 @@ enum ScrollButtonAlignment { final Alignment alignment; } + +enum SuggestionItemsType { + scrollable, + multiline; + + bool get isScrollType => this == SuggestionItemsType.scrollable; + + bool get isMultilineType => this == SuggestionItemsType.multiline; +} diff --git a/lib/src/widgets/suggestions/suggestion_list.dart b/lib/src/widgets/suggestions/suggestion_list.dart index 97799a29..3c3202fc 100644 --- a/lib/src/widgets/suggestions/suggestion_list.dart +++ b/lib/src/widgets/suggestions/suggestion_list.dart @@ -78,32 +78,22 @@ class _SuggestionListState extends State alignment: const AlignmentDirectional(-1.0, -1.0), heightFactor: math.max(_controller.value, 0.0), widthFactor: 1, - child: SingleChildScrollView( - scrollDirection: Axis.horizontal, - child: Row( - mainAxisAlignment: MainAxisAlignment.end, - children: List.generate( - suggestions.length, - (index) { - final suggestion = suggestions[index]; - return suggestion.config?.customItemBuilder - ?.call(index, suggestion) ?? - suggestionsItemConfig?.customItemBuilder - ?.call(index, suggestion) ?? - Padding( - padding: EdgeInsets.only( - right: index == suggestions.length - ? 0 - : suggestionsListConfig.itemSeparatorWidth, - ), - child: SuggestionItem( - suggestionItemData: suggestion, - ), - ); - }, - ), - ), - ), + child: suggestionsConfig?.suggestionItemType.isScrollType ?? false + ? SingleChildScrollView( + scrollDirection: Axis.horizontal, + child: Row( + children: _suggestionListWidget( + suggestionsItemConfig, + ), + ), + ) + : Wrap( + runSpacing: + suggestionsConfig?.spaceBetweenSuggestionItemRow ?? + 10, + alignment: WrapAlignment.end, + children: _suggestionListWidget(suggestionsItemConfig), + ), ); }, ), @@ -111,6 +101,30 @@ class _SuggestionListState extends State ); } + List _suggestionListWidget( + SuggestionItemConfig? suggestionsItemConfig) { + final suggestionsListConfig = + suggestionsConfig?.listConfig ?? const SuggestionListConfig(); + return List.generate( + suggestions.length, + (index) { + final suggestion = suggestions[index]; + return suggestion.config?.customItemBuilder?.call(index, suggestion) ?? + suggestionsItemConfig?.customItemBuilder?.call(index, suggestion) ?? + Padding( + padding: EdgeInsets.only( + right: index == suggestions.length + ? 0 + : suggestionsListConfig.itemSeparatorWidth, + ), + child: SuggestionItem( + suggestionItemData: suggestion, + ), + ); + }, + ); + } + @override void deactivate() { final newSuggestions = chatViewIW?.chatController.newSuggestions;