Show real photos for people instead of scene art
Your avatar is your photo, picked from the device by tapping it on Home or from a new Profile photo row in Settings, shrunk to 256 px and kept on the phone (there is no upload endpoint yet). Group members show the photo the server sends in a new `photo` field, everywhere avatars appear. Without a photo, an initial on a neutral disc. Mock mode bundles free Unsplash portraits for the sample people. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KhQh614DMeYoQEH9SoMRUw
This commit is contained in:
@@ -98,6 +98,16 @@ class GroupChatState extends State<GroupChat> implements ConnectGroupChat {
|
||||
_onSend(reply);
|
||||
}
|
||||
|
||||
/// A message author's photo, looked up among the group's members.
|
||||
String _photoOf(String authorId) {
|
||||
for (final member in widget.group.members) {
|
||||
if (member.id == authorId) {
|
||||
return member.photo;
|
||||
}
|
||||
}
|
||||
return "";
|
||||
}
|
||||
|
||||
// ── Views ─────────────────────────────────────────────────────────────────
|
||||
|
||||
Widget _mobileView(BoxConstraints constraints) {
|
||||
@@ -145,8 +155,7 @@ class GroupChatState extends State<GroupChat> implements ConnectGroupChat {
|
||||
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius:
|
||||
const BorderRadius.vertical(bottom: Radius.circular(20)),
|
||||
borderRadius: const BorderRadius.vertical(bottom: Radius.circular(20)),
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
@@ -188,7 +197,10 @@ class GroupChatState extends State<GroupChat> implements ConnectGroupChat {
|
||||
const SizedBox(width: 10),
|
||||
avatarStack(
|
||||
widget.group.members.map((member) => member.name).toList(), 30,
|
||||
max: 3, border: colorNight),
|
||||
photos:
|
||||
widget.group.members.map((member) => member.photo).toList(),
|
||||
max: 3,
|
||||
border: colorNight),
|
||||
],
|
||||
),
|
||||
);
|
||||
@@ -275,7 +287,8 @@ class GroupChatState extends State<GroupChat> implements ConnectGroupChat {
|
||||
children: [
|
||||
grouped
|
||||
? const SizedBox(width: 34)
|
||||
: memberAvatar(message.authorName, 34),
|
||||
: memberAvatar(message.authorName, 34,
|
||||
photo: _photoOf(message.authorId)),
|
||||
const SizedBox(width: 8),
|
||||
Flexible(
|
||||
child: Container(
|
||||
@@ -328,7 +341,8 @@ class GroupChatState extends State<GroupChat> implements ConnectGroupChat {
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
memberAvatar(message.authorName, 34),
|
||||
memberAvatar(message.authorName, 34,
|
||||
photo: _photoOf(message.authorId)),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
|
||||
@@ -329,7 +329,8 @@ class GroupDetailState extends State<GroupDetail>
|
||||
horizontal: 7, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: colorLime,
|
||||
borderRadius: const BorderRadius.all(Radius.circular(8)),
|
||||
borderRadius:
|
||||
const BorderRadius.all(Radius.circular(8)),
|
||||
),
|
||||
child: text(
|
||||
"${_group.unread} new", 10, TextType.Medium,
|
||||
@@ -519,7 +520,7 @@ class GroupDetailState extends State<GroupDetail>
|
||||
child: text("$rank", 16, TextType.Medium,
|
||||
color: rank == 1 ? colorInk : colorGrey2),
|
||||
),
|
||||
memberAvatar(member.name, 46),
|
||||
memberAvatar(member.name, 46, photo: member.photo),
|
||||
const SizedBox(width: 12),
|
||||
Expanded(
|
||||
child: Column(
|
||||
@@ -632,7 +633,8 @@ class GroupDetailState extends State<GroupDetail>
|
||||
alignment: Alignment.center,
|
||||
decoration: BoxDecoration(
|
||||
color: colorAmbientMid,
|
||||
borderRadius: const BorderRadius.all(Radius.circular(12)),
|
||||
borderRadius:
|
||||
const BorderRadius.all(Radius.circular(12)),
|
||||
),
|
||||
child: text(
|
||||
"+${formatAmount(preset)}", 15, TextType.Medium,
|
||||
|
||||
@@ -245,7 +245,7 @@ class GroupEditorState extends State<GroupEditor>
|
||||
text(name, 26, TextType.Light,
|
||||
color: colorWhite, maxLines: 2, overflow: TextOverflow.ellipsis),
|
||||
const SizedBox(height: 16),
|
||||
avatarStack(const <String>["Alex"], 34),
|
||||
avatarStack(const <String>["You"], 34),
|
||||
],
|
||||
),
|
||||
);
|
||||
|
||||
@@ -180,7 +180,8 @@ class GroupsState extends State<Groups> implements ConnectGroups {
|
||||
horizontal: 10, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
color: colorLime,
|
||||
borderRadius: const BorderRadius.all(Radius.circular(8)),
|
||||
borderRadius:
|
||||
const BorderRadius.all(Radius.circular(8)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
@@ -218,7 +219,10 @@ class GroupsState extends State<Groups> implements ConnectGroups {
|
||||
children: [
|
||||
avatarStack(
|
||||
group.members.map((member) => member.name).toList(),
|
||||
32),
|
||||
32,
|
||||
photos: group.members
|
||||
.map((member) => member.photo)
|
||||
.toList()),
|
||||
const Spacer(),
|
||||
text("${(group.progress * 100).round()}%", 22,
|
||||
TextType.Light,
|
||||
|
||||
Reference in New Issue
Block a user