chore: Fix design for smaller screens

This commit is contained in:
Christian Pauly 2022-01-15 13:18:25 +01:00
parent de7699addb
commit af02f90a1b
3 changed files with 225 additions and 209 deletions

View File

@ -79,9 +79,11 @@ class _InviteStoryPageState extends State<InviteStoryPage> {
onPressed: () => Navigator.of(context).pop<bool>(false),
),
title: Text(L10n.of(context)!.whoCanSeeMyStories),
bottom: PreferredSize(
preferredSize: const Size.fromHeight(56),
child: ListTile(
elevation: 0,
),
body: Column(
children: [
ListTile(
title: Text(L10n.of(context)!.whoCanSeeMyStoriesDesc),
leading: CircleAvatar(
backgroundColor: Theme.of(context).secondaryHeaderColor,
@ -89,35 +91,40 @@ class _InviteStoryPageState extends State<InviteStoryPage> {
child: const Icon(Icons.lock),
),
),
),
const Divider(height: 1),
Expanded(
child: FutureBuilder<List<User>>(
future: loadContacts,
builder: (context, snapshot) {
final contacts = snapshot.data;
if (contacts == null) {
final error = snapshot.error;
if (error != null) {
return Center(
child: Text(error.toLocalizedString(context)));
}
return const Center(
child: CircularProgressIndicator.adaptive());
}
_undecided = contacts.map((u) => u.id).toSet();
return ListView.builder(
itemCount: contacts.length,
itemBuilder: (context, i) => SwitchListTile.adaptive(
value: _invite.contains(contacts[i].id),
onChanged: (b) => setState(() => b
? _invite.add(contacts[i].id)
: _invite.remove(contacts[i].id)),
secondary: Avatar(
mxContent: contacts[i].avatarUrl,
name: contacts[i].calcDisplayname(),
),
title: Text(contacts[i].calcDisplayname()),
),
);
}),
),
],
),
body: FutureBuilder<List<User>>(
future: loadContacts,
builder: (context, snapshot) {
final contacts = snapshot.data;
if (contacts == null) {
final error = snapshot.error;
if (error != null) {
return Center(child: Text(error.toLocalizedString(context)));
}
return const Center(child: CircularProgressIndicator.adaptive());
}
_undecided = contacts.map((u) => u.id).toSet();
return ListView.builder(
itemCount: contacts.length,
itemBuilder: (context, i) => SwitchListTile.adaptive(
value: _invite.contains(contacts[i].id),
onChanged: (b) => setState(() => b
? _invite.add(contacts[i].id)
: _invite.remove(contacts[i].id)),
secondary: Avatar(
mxContent: contacts[i].avatarUrl,
name: contacts[i].calcDisplayname(),
),
title: Text(contacts[i].calcDisplayname()),
),
);
}),
floatingActionButton: FloatingActionButton.extended(
onPressed: _inviteAction,
label: Text(L10n.of(context)!.publish),

View File

@ -28,158 +28,162 @@ class ChatEncryptionSettingsView extends StatelessWidget {
VRouter.of(context).toSegments(['rooms', controller.roomId]),
),
title: Text(L10n.of(context).tapOnDeviceToVerify),
bottom: PreferredSize(
preferredSize: const Size.fromHeight(56),
child: ListTile(
title: Text(L10n.of(context).deviceVerifyDescription),
leading: CircleAvatar(
backgroundColor: Theme.of(context).secondaryHeaderColor,
foregroundColor: Theme.of(context).colorScheme.secondary,
child: const Icon(Icons.lock),
),
),
),
elevation: 0,
),
body: MaxWidthBody(
withScrolling: true,
child: StreamBuilder(
stream: room.onUpdate.stream,
builder: (context, snapshot) {
return FutureBuilder<List<DeviceKeys>>(
future: room.getUserDeviceKeys(),
builder: (BuildContext context, snapshot) {
if (snapshot.hasError) {
return Center(
child: Text(L10n.of(context).oopsSomethingWentWrong +
': ' +
snapshot.error.toString()),
);
}
if (!snapshot.hasData) {
return const Center(
child:
CircularProgressIndicator.adaptive(strokeWidth: 2));
}
final deviceKeys = snapshot.data;
return ListView.builder(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: deviceKeys.length,
itemBuilder: (BuildContext context, int i) => Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
if (i == 0 ||
deviceKeys[i].userId !=
deviceKeys[i - 1].userId) ...{
const Divider(height: 1, thickness: 1),
PopupMenuButton(
onSelected: (action) => controller.onSelected(
context, action, deviceKeys[i]),
itemBuilder: (c) {
final items = <PopupMenuEntry<String>>[];
if (room
.client
.userDeviceKeys[deviceKeys[i].userId]
.verified ==
UserVerifiedStatus.unknown) {
items.add(PopupMenuItem(
value: 'verify_user',
child: Text(L10n.of(context).verifyUser),
));
}
return items;
},
child: ListTile(
leading: Avatar(
mxContent: room
.getUserByMXIDSync(deviceKeys[i].userId)
.avatarUrl,
name: room
.getUserByMXIDSync(deviceKeys[i].userId)
.calcDisplayname(),
),
title: Text(
room
.getUserByMXIDSync(deviceKeys[i].userId)
.calcDisplayname(),
),
subtitle: Text(
deviceKeys[i].userId,
style: const TextStyle(
fontWeight: FontWeight.w300),
),
),
),
},
PopupMenuButton(
onSelected: (action) => controller.onSelected(
context, action, deviceKeys[i]),
itemBuilder: (c) {
final items = <PopupMenuEntry<String>>[];
if (deviceKeys[i].blocked ||
!deviceKeys[i].verified) {
items.add(PopupMenuItem(
value:
deviceKeys[i].userId == room.client.userID
? 'verify'
: 'verify_user',
child: Text(L10n.of(context).verifyStart),
));
}
if (deviceKeys[i].blocked) {
items.add(PopupMenuItem(
value: 'unblock',
child: Text(L10n.of(context).unblockDevice),
));
}
if (!deviceKeys[i].blocked) {
items.add(PopupMenuItem(
value: 'block',
child: Text(L10n.of(context).blockDevice),
));
}
return items;
},
child: ListTile(
leading: CircleAvatar(
foregroundColor: Colors.white,
backgroundColor: deviceKeys[i].color,
child: Icon(deviceKeys[i].icon),
),
title: Text(
deviceKeys[i].displayname,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
subtitle: Row(
children: [
Text(
deviceKeys[i].deviceId,
style: const TextStyle(
fontWeight: FontWeight.w300),
),
const Spacer(),
Text(
deviceKeys[i].blocked
? L10n.of(context).blocked
: deviceKeys[i].verified
? L10n.of(context).verified
: L10n.of(context).unverified,
style: TextStyle(
fontSize: 14,
color: deviceKeys[i].color,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
ListTile(
title: Text(L10n.of(context).deviceVerifyDescription),
leading: CircleAvatar(
backgroundColor: Theme.of(context).secondaryHeaderColor,
foregroundColor: Theme.of(context).colorScheme.secondary,
child: const Icon(Icons.lock),
),
),
const Divider(height: 1),
StreamBuilder(
stream: room.onUpdate.stream,
builder: (context, snapshot) {
return FutureBuilder<List<DeviceKeys>>(
future: room.getUserDeviceKeys(),
builder: (BuildContext context, snapshot) {
if (snapshot.hasError) {
return Center(
child: Text(L10n.of(context).oopsSomethingWentWrong +
': ' +
snapshot.error.toString()),
);
}
if (!snapshot.hasData) {
return const Center(
child: CircularProgressIndicator.adaptive(
strokeWidth: 2));
}
final deviceKeys = snapshot.data;
return ListView.builder(
shrinkWrap: true,
physics: const NeverScrollableScrollPhysics(),
itemCount: deviceKeys.length,
itemBuilder: (BuildContext context, int i) => Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
if (i == 0 ||
deviceKeys[i].userId !=
deviceKeys[i - 1].userId) ...{
const Divider(height: 1, thickness: 1),
PopupMenuButton(
onSelected: (action) => controller.onSelected(
context, action, deviceKeys[i]),
itemBuilder: (c) {
final items = <PopupMenuEntry<String>>[];
if (room
.client
.userDeviceKeys[deviceKeys[i].userId]
.verified ==
UserVerifiedStatus.unknown) {
items.add(PopupMenuItem(
value: 'verify_user',
child: Text(L10n.of(context).verifyUser),
));
}
return items;
},
child: ListTile(
leading: Avatar(
mxContent: room
.getUserByMXIDSync(deviceKeys[i].userId)
.avatarUrl,
name: room
.getUserByMXIDSync(deviceKeys[i].userId)
.calcDisplayname(),
),
title: Text(
room
.getUserByMXIDSync(deviceKeys[i].userId)
.calcDisplayname(),
),
subtitle: Text(
deviceKeys[i].userId,
style: const TextStyle(
fontWeight: FontWeight.w300),
),
),
],
),
},
PopupMenuButton(
onSelected: (action) => controller.onSelected(
context, action, deviceKeys[i]),
itemBuilder: (c) {
final items = <PopupMenuEntry<String>>[];
if (deviceKeys[i].blocked ||
!deviceKeys[i].verified) {
items.add(PopupMenuItem(
value: deviceKeys[i].userId ==
room.client.userID
? 'verify'
: 'verify_user',
child: Text(L10n.of(context).verifyStart),
));
}
if (deviceKeys[i].blocked) {
items.add(PopupMenuItem(
value: 'unblock',
child: Text(L10n.of(context).unblockDevice),
));
}
if (!deviceKeys[i].blocked) {
items.add(PopupMenuItem(
value: 'block',
child: Text(L10n.of(context).blockDevice),
));
}
return items;
},
child: ListTile(
leading: CircleAvatar(
foregroundColor: Colors.white,
backgroundColor: deviceKeys[i].color,
child: Icon(deviceKeys[i].icon),
),
title: Text(
deviceKeys[i].displayname,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
subtitle: Row(
children: [
Text(
deviceKeys[i].deviceId,
style: const TextStyle(
fontWeight: FontWeight.w300),
),
const Spacer(),
Text(
deviceKeys[i].blocked
? L10n.of(context).blocked
: deviceKeys[i].verified
? L10n.of(context).verified
: L10n.of(context).unverified,
style: TextStyle(
fontSize: 14,
color: deviceKeys[i].color,
),
),
],
),
),
),
),
],
),
],
),
);
},
);
},
);
}),
}),
],
),
),
);
}

View File

@ -17,9 +17,11 @@ class SettingsStoriesView extends StatelessWidget {
return Scaffold(
appBar: AppBar(
title: Text(L10n.of(context)!.whoCanSeeMyStories),
bottom: PreferredSize(
preferredSize: const Size.fromHeight(56),
child: ListTile(
elevation: 0,
),
body: Column(
children: [
ListTile(
title: Text(L10n.of(context)!.whoCanSeeMyStoriesDesc),
leading: CircleAvatar(
backgroundColor: Theme.of(context).secondaryHeaderColor,
@ -27,37 +29,40 @@ class SettingsStoriesView extends StatelessWidget {
child: const Icon(Icons.lock),
),
),
),
),
body: FutureBuilder(
future: controller.loadUsers,
builder: (context, snapshot) {
final error = snapshot.error;
if (error != null) {
return Center(child: Text(error.toLocalizedString(context)));
}
if (snapshot.connectionState != ConnectionState.done) {
return const Center(
child: CircularProgressIndicator.adaptive(
strokeWidth: 2,
));
}
return ListView.builder(
itemCount: controller.users.length,
itemBuilder: (context, i) {
final user = controller.users.keys.toList()[i];
return SwitchListTile.adaptive(
value: controller.users[user] ?? false,
onChanged: (_) => controller.toggleUser(user),
secondary: Avatar(
mxContent: user.avatarUrl,
name: user.calcDisplayname(),
),
title: Text(user.calcDisplayname()),
);
},
);
},
const Divider(height: 1),
Expanded(
child: FutureBuilder(
future: controller.loadUsers,
builder: (context, snapshot) {
final error = snapshot.error;
if (error != null) {
return Center(child: Text(error.toLocalizedString(context)));
}
if (snapshot.connectionState != ConnectionState.done) {
return const Center(
child: CircularProgressIndicator.adaptive(
strokeWidth: 2,
));
}
return ListView.builder(
itemCount: controller.users.length,
itemBuilder: (context, i) {
final user = controller.users.keys.toList()[i];
return SwitchListTile.adaptive(
value: controller.users[user] ?? false,
onChanged: (_) => controller.toggleUser(user),
secondary: Avatar(
mxContent: user.avatarUrl,
name: user.calcDisplayname(),
),
title: Text(user.calcDisplayname()),
);
},
);
},
),
),
],
),
);
}