💄 Better call ui
This commit is contained in:
parent
73982f48d6
commit
de00a20eee
@ -9,6 +9,7 @@ import 'package:solian/theme.dart';
|
|||||||
import 'package:solian/widgets/app_bar_leading.dart';
|
import 'package:solian/widgets/app_bar_leading.dart';
|
||||||
import 'package:solian/widgets/chat/call/call_controls.dart';
|
import 'package:solian/widgets/chat/call/call_controls.dart';
|
||||||
import 'package:solian/widgets/chat/call/call_participant.dart';
|
import 'package:solian/widgets/chat/call/call_participant.dart';
|
||||||
|
import 'package:livekit_client/livekit_client.dart' as livekit;
|
||||||
|
|
||||||
class CallScreen extends StatefulWidget {
|
class CallScreen extends StatefulWidget {
|
||||||
const CallScreen({super.key});
|
const CallScreen({super.key});
|
||||||
@ -161,13 +162,13 @@ class _CallScreenState extends State<CallScreen> with TickerProviderStateMixin {
|
|||||||
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||||||
crossAxisCount: columns,
|
crossAxisCount: columns,
|
||||||
childAspectRatio: tileWidth / tileHeight,
|
childAspectRatio: tileWidth / tileHeight,
|
||||||
|
crossAxisSpacing: 8,
|
||||||
|
mainAxisSpacing: 8,
|
||||||
),
|
),
|
||||||
itemCount: math.max(0, call.participantTracks.length),
|
itemCount: math.max(0, call.participantTracks.length),
|
||||||
itemBuilder: (BuildContext context, int index) {
|
itemBuilder: (BuildContext context, int index) {
|
||||||
final track = call.participantTracks[index];
|
final track = call.participantTracks[index];
|
||||||
return Padding(
|
return Card(
|
||||||
padding: const EdgeInsets.all(16),
|
|
||||||
child: Card(
|
|
||||||
child: ClipRRect(
|
child: ClipRRect(
|
||||||
borderRadius: const BorderRadius.all(Radius.circular(8)),
|
borderRadius: const BorderRadius.all(Radius.circular(8)),
|
||||||
child: InteractiveParticipantWidget(
|
child: InteractiveParticipantWidget(
|
||||||
@ -181,11 +182,10 @@ class _CallScreenState extends State<CallScreen> with TickerProviderStateMixin {
|
|||||||
},
|
},
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
);
|
).paddingAll(8);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -246,8 +246,77 @@ class _CallScreenState extends State<CallScreen> with TickerProviderStateMixin {
|
|||||||
width: MediaQuery.of(context).size.width,
|
width: MediaQuery.of(context).size.width,
|
||||||
height: 64,
|
height: 64,
|
||||||
child: Row(
|
child: Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.center,
|
||||||
children: [
|
children: [
|
||||||
const Expanded(child: SizedBox()),
|
Builder(builder: (context) {
|
||||||
|
final call = Get.find<ChatCallProvider>();
|
||||||
|
final connectionQuality =
|
||||||
|
call.room.localParticipant?.connectionQuality ??
|
||||||
|
livekit.ConnectionQuality.unknown;
|
||||||
|
return Expanded(
|
||||||
|
child: Column(
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: [
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
Text(call.room.serverRegion ?? 'unknown'),
|
||||||
|
const SizedBox(width: 6),
|
||||||
|
Text(call.room.serverVersion ?? 'unknown')
|
||||||
|
],
|
||||||
|
),
|
||||||
|
Row(
|
||||||
|
children: [
|
||||||
|
Text(
|
||||||
|
{
|
||||||
|
livekit.ConnectionState.disconnected:
|
||||||
|
'callStatusDisconnected'.tr,
|
||||||
|
livekit.ConnectionState.connected:
|
||||||
|
'callStatusConnected'.tr,
|
||||||
|
livekit.ConnectionState.connecting:
|
||||||
|
'callStatusConnecting'.tr,
|
||||||
|
livekit.ConnectionState.reconnecting:
|
||||||
|
'callStatusReconnecting'.tr,
|
||||||
|
}[call.room.connectionState]!,
|
||||||
|
),
|
||||||
|
const SizedBox(width: 6),
|
||||||
|
if (connectionQuality !=
|
||||||
|
livekit.ConnectionQuality.unknown)
|
||||||
|
Icon(
|
||||||
|
{
|
||||||
|
livekit.ConnectionQuality.excellent:
|
||||||
|
Icons.signal_cellular_alt,
|
||||||
|
livekit.ConnectionQuality.good:
|
||||||
|
Icons.signal_cellular_alt_2_bar,
|
||||||
|
livekit.ConnectionQuality.poor:
|
||||||
|
Icons.signal_cellular_alt_1_bar,
|
||||||
|
}[connectionQuality],
|
||||||
|
color: {
|
||||||
|
livekit.ConnectionQuality.excellent:
|
||||||
|
Colors.green,
|
||||||
|
livekit.ConnectionQuality.good:
|
||||||
|
Colors.orange,
|
||||||
|
livekit.ConnectionQuality.poor:
|
||||||
|
Colors.red,
|
||||||
|
}[connectionQuality],
|
||||||
|
size: 16,
|
||||||
|
)
|
||||||
|
else
|
||||||
|
const SizedBox(
|
||||||
|
width: 12,
|
||||||
|
height: 12,
|
||||||
|
child: CircularProgressIndicator(
|
||||||
|
color: Colors.white,
|
||||||
|
strokeWidth: 2,
|
||||||
|
),
|
||||||
|
).paddingAll(3),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}),
|
||||||
IconButton(
|
IconButton(
|
||||||
icon: _layoutMode == 0
|
icon: _layoutMode == 0
|
||||||
? const Icon(Icons.view_list)
|
? const Icon(Icons.view_list)
|
||||||
@ -257,7 +326,7 @@ class _CallScreenState extends State<CallScreen> with TickerProviderStateMixin {
|
|||||||
},
|
},
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
).paddingSymmetric(horizontal: 10),
|
).paddingOnly(left: 20, right: 16),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
Expanded(
|
Expanded(
|
||||||
|
|||||||
@ -333,4 +333,8 @@ const i18nSimplifiedChinese = {
|
|||||||
'readMore': '阅读更多',
|
'readMore': '阅读更多',
|
||||||
'attachmentUnload': '附件未加载',
|
'attachmentUnload': '附件未加载',
|
||||||
'attachmentUnloadCaption': '为了节省流量，本附件未自动加载，点一下来开始加载。',
|
'attachmentUnloadCaption': '为了节省流量，本附件未自动加载，点一下来开始加载。',
|
||||||
|
'callStatusConnected': '已连接',
|
||||||
|
'callStatusDisconnected': '已断开',
|
||||||
|
'callStatusConnecting': '连接中',
|
||||||
|
'callStatusReconnected': '重连中',
|
||||||
};
|
};
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user