Scribd
Upload
12 views3 pages

List View by Chatgpt App

The document defines a Contact class to represent contacts with name, profile image and last message. It then defines a MyApp class that builds a chat app UI with a list of sample contacts. Each contact opens a ChatScreen where users can display and send messages.

Uploaded by

Green Gaming
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
12 views3 pages

List View by Chatgpt App

The document defines a Contact class to represent contacts with name, profile image and last message. It then defines a MyApp class that builds a chat app UI with a list of sample contacts. Each contact opens a ChatScreen where users can display and send messages.

Uploaded by

Green Gaming
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 3

import 'package:flutter/material.

dart';

void main() {
runApp(MyApp());
}

class Contact {
final String name;
final String profileImage;
final String lastMessage;

const Contact({
required this.name,
required this.profileImage,
required this.lastMessage,
});
}

class MyApp extends StatelessWidget {


final List<Contact> contacts = const [
Contact(
name: 'Alice',
profileImage:
'https://randomuser.me/api/portraits/women/24.jpg',
lastMessage: 'Hey, what\'s up?',
),
Contact(
name: 'Bob',
profileImage:
'https://randomuser.me/api/portraits/men/21.jpg',
lastMessage: 'How\'s it going?',
),
Contact(
name: 'Charlie',
profileImage:
'https://randomuser.me/api/portraits/men/23.jpg',
lastMessage: 'Long time no see.',
),
];

@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Chat App',
home: Scaffold(
appBar: AppBar(
title: Text('Chat App'),
),
body: ListView.builder(
itemCount: contacts.length,
itemBuilder: (BuildContext context, int index) {
final contact = contacts[index];
return ListTile(
leading: CircleAvatar(
backgroundImage: NetworkImage(contact.profileImage),
),
title: Text(contact.name),
subtitle: Text(contact.lastMessage),
onTap: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ChatScreen(contact: contact),
),
);
},
);
},
),
),
);
}
}

class ChatScreen extends StatefulWidget {


final Contact contact;

const ChatScreen({required this.contact});

@override
_ChatScreenState createState() => _ChatScreenState();
}

class _ChatScreenState extends State<ChatScreen> {


final TextEditingController _textController = TextEditingController();

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: BackButton(
onPressed: () {
Navigator.pop(context);
},
),
title: Text(widget.contact.name),
),
body: Column(
children: [
Expanded(
child: ListView(
children: [
_buildMessage('Hey, what\'s up?', true),
_buildMessage('Not much, how about you?', false),
_buildMessage('Same old, same old.', true),
_buildMessage('Cool.', false),
],
),
),
Container(
margin: const EdgeInsets.symmetric(horizontal: 8.0),
decoration: BoxDecoration(
color: Theme.of(context).cardColor,
borderRadius: BorderRadius.circular(25.0),
),
child: Row(
children: [
Expanded(
child: Padding(
padding: const EdgeInsets.only(left: 16.0),
child: TextField(
controller: _textController,
decoration: InputDecoration.collapsed(
hintText: 'Send a message...',
),
),
),
),
IconButton(
icon: Icon(Icons.send),
onPressed: () {
if (_textController.text.isNotEmpty) {
setState(() {
// TODO: add logic to send message
_textController.clear();
});
}
},
),
],
),
),
],
),
);
}
Widget _buildMessage(String text, bool isMe) {
return Align(
alignment: isMe ? Alignment.centerRight : Alignment.centerLeft,
child: Container(
margin: EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
padding: EdgeInsets.all(16.0),
decoration: BoxDecoration(
color: isMe ? Colors.blue : Colors.grey[300],
borderRadius: BorderRadius.circular(16.0),
),
child: Text(
text,
style: TextStyle(fontSize: 16.0),
),
),
);
}
}

You might also like