chatScreenStory top-level property
Story
chatScreenStory
getter/setter pair
Implementation
Story chatScreenStory = Story(
name: 'Chat Screen',
builder: (context) {
final String initials =
context.knobs.text(label: 'Initials (Avatar)', initial: 'S');
final String name = context.knobs.text(label: 'Name', initial: 'Name');
final String placeHolderText =
context.knobs.text(label: 'Placeholder', initial: 'Write your message');
final Color senderBackgroundColor = context.knobs.options(
label: 'Sender Background Color',
initial: ThemeColors.primary,
options: [
Option(label: 'Orange', value: ThemeColors.primary),
Option(label: 'Blue', value: Colors.lightBlueAccent),
]);
final Color receiverBackgroundColor = context.knobs.options(
label: 'Receiver Background Color',
initial: Color(0xFFEEEEEE),
options: [
Option(label: 'Grey', value: Color(0xFFEEEEEE)),
Option(label: 'Brown', value: Color.fromARGB(255, 162, 134, 134)),
]);
final Color avatarBackgroundColor = context.knobs.options(
label: 'Avatar Background Color',
initial: Color(0xFF06AF79),
options: [
Option(label: 'Orange', value: ThemeColors.primary),
Option(label: 'Blue', value: Colors.lightBlueAccent),
Option(label: 'Green', value: Color(0xFF06AF79)),
]);
List<ChatMessageStructure> messages = [
ChatMessageStructure(
messageContent: 'Hello chatGPT,how are you today?',
messageType: MessageType.sender),
ChatMessageStructure(
messageContent: "Hello, I'm fine,how can i help you?",
messageType: MessageType.receiver),
ChatMessageStructure(
messageContent: "What is the best programming language?",
messageType: MessageType.sender),
ChatMessageStructure(
messageContent:
"There are many programming languages in the market that are used in designing and building websites, various applications and other tasks. All these languages are popular in their place and in the way they are used, and many programmers learn and use them.",
messageType: MessageType.receiver),
ChatMessageStructure(
messageContent: "So explain to me more",
messageType: MessageType.sender),
];
return Scaffold(
body: SafeArea(
child: ChatScreen(
name: name,
avatarBackgroundColor: avatarBackgroundColor,
iconInitial: initials,
initialMessages: messages,
placeholderText: placeHolderText,
senderBackgroundColor: senderBackgroundColor,
receiverBackgroundColor: receiverBackgroundColor,
onBackPressed: () {
print("On back button pressed");
},
)),
);
},
);