Skip to content
This repository has been archived by the owner. It is now read-only.

hm-lesson18/Evgan #49

Open
Evgan wants to merge 1 commit into
base: main
Choose a base branch
from
Open

hm-lesson18/Evgan #49

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
74 changes: 74 additions & 0 deletions flutter_base/lib/ui_practice/data.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,3 +27,77 @@ final List<UserItemModel> resentUsersList = List.generate(
lastMessage: "Last message string",
),
);

enum MessageType { input, output }

class ChatItemMessageModel {
final MessageType type;
final String date;
final String text;

ChatItemMessageModel({
required this.type,
required this.date,
required this.text,
});
}

final List<ChatItemMessageModel> mockMessagesList = [
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:28',
text: 'text output 16'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:28',
text: 'text output 15'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:27',
text: 'text output 14'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:27',
text: 'text output 13'),
ChatItemMessageModel(
type: MessageType.input, date: '2022-06-20 20:20', text: 'text input 12'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:26',
text:
'text text text text text text text text text text text text text output 11'),
ChatItemMessageModel(
type: MessageType.input,
date: '2022-06-20 20:25',
text: 'text text text text text text text input 10'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:24',
text: 'text output 9'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:24',
text: 'text output 8'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:20',
text: 'text output 7'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:20',
text: 'text output 6'),
ChatItemMessageModel(
type: MessageType.output,
date: '2022-06-20 20:20',
text: 'text output 5'),
ChatItemMessageModel(
type: MessageType.input, date: '2022-06-28 20:19', text: 'Хорошо'),
ChatItemMessageModel(
type: MessageType.input,
date: '2022-06-28 20:18',
text: 'Привет привет?'),
ChatItemMessageModel(
type: MessageType.output, date: '2022-06-28 20:17', text: 'Как дела'),
ChatItemMessageModel(
type: MessageType.output, date: '2022-06-28 20:16', text: 'Привет'),
];
86 changes: 74 additions & 12 deletions flutter_base/lib/ui_practice/main.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import 'dart:developer';
import 'dart:ui';

import 'package:flutter/material.dart';
Expand All @@ -10,6 +11,9 @@ abstract class AppColors {
static const Color mainBgColor = Color.fromRGBO(27, 32, 45, 1);
static const Color secondaryBgColor = Color.fromRGBO(41, 47, 63, 1);

static const Color inputMsgBgColor = Color.fromRGBO(55, 62, 78, 1);
static const Color outputMsgBgColor = Color.fromRGBO(122, 129, 148, 1);

static const Color textPrimaryColor = Colors.white;
static const Color textSecondaryColor = Color.fromRGBO(179, 185, 201, 1);
}
Expand Down Expand Up @@ -57,6 +61,13 @@ abstract class AppTextStyle {
fontWeight: FontWeight.w400,
color: AppColors.textSecondaryColor,
);

static const TextStyle hint = TextStyle(
fontFamily: 'Poppins',
fontSize: 12.0,
fontWeight: FontWeight.w400,
color: AppColors.textSecondaryColor,
);
}

void main() {
Expand Down Expand Up @@ -268,6 +279,44 @@ class _ChatListItem extends StatelessWidget {
}
}

class _ChatMsg extends StatelessWidget {
final ChatItemMessageModel msgData;
const _ChatMsg({Key? key, required this.msgData}) : super(key: key);

@override
Widget build(BuildContext context) {
double _widthStage = MediaQuery.of(context).size.width;
double _maxWidth = _widthStage * 0.80;
final Color _bgColot = msgData.type == MessageType.input
? AppColors.inputMsgBgColor
: AppColors.outputMsgBgColor;
final AlignmentGeometry _aligment = msgData.type == MessageType.input
? Alignment.topLeft
: Alignment.topRight;
final TextAlign _textAlign =
msgData.type == MessageType.input ? TextAlign.left : TextAlign.right;
// final
return Padding(
padding: const EdgeInsets.all(10),
child: Container(
width: _widthStage,
alignment: _aligment,
child: Container(
constraints: BoxConstraints(maxWidth: _maxWidth),
decoration: BoxDecoration(
color: _bgColot, borderRadius: BorderRadius.circular(20)),
child: Padding(
padding: const EdgeInsets.only(
bottom: 12, left: 20, right: 20, top: 12),
child: Text(
msgData.text,
textAlign: _textAlign,
style: AppTextStyle.label,
)),
)));
}
}

class ChatDetail extends StatelessWidget {
const ChatDetail({Key? key}) : super(key: key);

Expand Down Expand Up @@ -312,18 +361,30 @@ class ChatDetail extends StatelessWidget {
body: Column(
children: [
Expanded(
child: ListView.separated(
separatorBuilder: (context, index) {
if (index != 5 ) {
return Container();
}
return Divider();
},
itemBuilder: (context, index) {
return const Text("asdasd");
},
itemCount: 120,
)),
child: ListView.builder(
reverse: true,
itemBuilder: ((context, index) {
final ChatItemMessageModel msgItem =
mockMessagesList[index];
final bool isNewDate = index == 0 ||
msgItem.date != mockMessagesList[index - 1].date;
if (isNewDate) {
return Column(
children: [
Padding(
padding: const EdgeInsets.all(10),
child: Text(msgItem.date,
style: AppTextStyle.label)),
_ChatMsg(msgData: msgItem)
],
);
} else {
return Column(
children: [_ChatMsg(msgData: msgItem)],
);
}
}),
itemCount: mockMessagesList.length)),
Container(
padding: const EdgeInsets.only(
left: 14,
Expand Down Expand Up @@ -364,6 +425,7 @@ class ChatDetail extends StatelessWidget {
child: const TextField(
decoration: InputDecoration(
hintText: "Message",
hintStyle: AppTextStyle.hint,
border: InputBorder.none,
),
),
Expand Down