confirmationScreen function
Implementation
Widget confirmationScreen(context, EnxController obj) {
// Get comprehensive screen information
final mediaQuery = MediaQuery.of(context);
final screenWidth = mediaQuery.size.width;
final screenHeight = mediaQuery.size.height;
final isPortrait = mediaQuery.orientation == Orientation.portrait;
// Get all padding information
final viewPadding = mediaQuery.viewPadding;
final viewInsets = mediaQuery.viewInsets;
final padding = mediaQuery.padding;
// Calculate system UI heights more accurately
final statusBarHeight = viewPadding.top;
final bottomSystemUIHeight = Platform.isAndroid
? (viewPadding.bottom > 0 ? viewPadding.bottom : 0)
: padding.bottom;
// Calculate app bar height more reliably
double appBarHeight = 0.0;
try {
final scaffold = Scaffold.maybeOf(context);
if (scaffold != null && scaffold.hasAppBar) {
appBarHeight = AppBar().preferredSize.height;
}
} catch (e) {
appBarHeight = 0.0;
}
// Calculate the actual usable height
final totalSystemUIHeight = statusBarHeight + bottomSystemUIHeight + appBarHeight;
final usableHeight = screenHeight - totalSystemUIHeight;
// Define control panel height based on orientation
final controlPanelHeight = isPortrait ? 180.0 : 20.0;
// Calculate video area height
final videoHeight = usableHeight - controlPanelHeight;
return Scaffold(
body: Container(
color: Colors.white,
child: SafeArea(
child: Column(
children: [
// Video Preview Area
Expanded(
child: isPortrait
? Stack(
children: [
// Video Player - Always render widget to ensure proper initialization
Obx(() => Stack(
children: [
// Always render EnxPlayerWidget so it can initialize properly
SizedBox(
width: screenWidth,
height: videoHeight,
child: EnxPlayerWidget(
0,
key: ValueKey('preview_${obj.isSelect.value[1]}_${obj.isSelect.value[2]}_${obj.previewInitCounter.value}'),
local: true,
zMediaOverlay: false,
height: videoHeight.toInt(),
width: screenWidth.toInt(),
),
),
// Overlay placeholder when video is muted
if (obj.isSelect.value[1] || obj.isSelect.value[2])
Container(
width: screenWidth,
height: videoHeight,
color: Colors.grey,
child: const Icon(
Icons.videocam_off_outlined,
size: 60,
color: Colors.white,
),
),
],
)),
// Camera flip button
Positioned(
top: 16,
left: 16,
child: Container(
decoration: BoxDecoration(
color: Colors.black.withOpacity(0.5),
borderRadius: BorderRadius.circular(25),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.3),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 2),
),
],
),
child: IconButton(
icon: const Icon(
Icons.flip_camera_ios_outlined,
color: Colors.white,
size: 24,
),
onPressed: () {
if (EnxSetting.instance.isFontCamera) {
obj.switchCameraPreview();
} else {
obj.handleSingleClick();
}
},
),
),
),
],
)
: Row(
children: [
// Video Player (Landscape)
Expanded(
flex: 3,
child: Stack(
children: [
Obx(() => Stack(
children: [
// Always render EnxPlayerWidget so it can initialize properly
SizedBox(
height: videoHeight,
width: screenWidth,
child: EnxPlayerWidget(
0,
key: ValueKey('preview_landscape_${obj.isSelect.value[1]}_${obj.isSelect.value[2]}_${obj.previewInitCounter.value}'),
local: true,
zMediaOverlay: false,
height: videoHeight.toInt(),
),
),
// Overlay placeholder when video is muted
if (obj.isSelect.value[1] || obj.isSelect.value[2])
Container(
height: videoHeight,
width: screenWidth,
color: Colors.grey,
child: const Icon(
Icons.videocam_off_outlined,
size: 60,
color: Colors.white,
),
),
],
)),
// Camera flip button (Landscape)
Positioned(
top: 16,
left: 16,
child: Container(
decoration: BoxDecoration(
color: Colors.black.withOpacity(0.5),
borderRadius: BorderRadius.circular(20),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.3),
spreadRadius: 1,
blurRadius: 3,
offset: const Offset(0, 2),
),
],
),
child: IconButton(
icon: const Icon(
Icons.flip_camera_ios_outlined,
color: Colors.white,
size: 20,
),
onPressed: () {
if (EnxSetting.instance.isFontCamera) {
obj.switchCameraPreview();
} else {
obj.handleSingleClick();
}
},
),
),
),
],
),
),
// Controls (Landscape)
Expanded(
flex: 2,
child: Container(
height: videoHeight,
padding: const EdgeInsets.all(8),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Toggle buttons and settings on same row
Row(
mainAxisAlignment: MainAxisAlignment.center, // Centers both elements together
children: [
_buildToggleButtons(obj, context, false), // Natural width
const SizedBox(width: 8), // Small 8px gap
_buildSettingsButton(obj, context, false), // Natural width
],
),
const SizedBox(height: 24),
_buildJoinButton(obj, context, false),
],
),
),
),
],
),
),
// Control Panel (Portrait only)
if (isPortrait)
Container(
height: controlPanelHeight,
width: screenWidth,
margin: EdgeInsets.all(screenWidth * 0.04),
child: Card(
color: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
elevation: 8,
child: Padding(
padding: EdgeInsets.all(screenWidth * 0.06),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween, // Even distribution
children: [
_buildToggleButtons(obj, context, true), // Left side
_buildSettingsButton(obj, context, true), // Right side
],
),
const SizedBox(height: 16),
_buildJoinButton(obj, context, true),
],
),
),
),
),
],
),
),
),
);
}