1
0
mirror of https://gitlab.com/comunic/comunicmobile synced 2024-12-24 11:58:51 +00:00

Improve buttons bar

This commit is contained in:
Pierre HUBERT 2020-05-10 14:32:44 +02:00
parent ef186f79d2
commit 1d7e846973
2 changed files with 58 additions and 24 deletions

View File

@ -28,10 +28,15 @@ enum _PopupMenuOption { STOP_STREAMING, SWITCH_CAMERA }
class CallScreen extends StatefulWidget {
final int convID;
final bool floatingButtons;
const CallScreen({Key key, @required this.convID})
: assert(convID != null),
const CallScreen({
Key key,
@required this.convID,
this.floatingButtons = true,
}) : assert(convID != null),
assert(convID > 0),
assert(floatingButtons != null),
super(key: key);
@override
@ -479,7 +484,10 @@ class _CallScreenState extends SafeState<CallScreen> {
return Column(
children: <Widget>[
_canHideMenuBar ? Container() : _buildMembersArea(),
Expanded(child: LayoutBuilder(builder: _buildVideosArea))
Expanded(child: LayoutBuilder(builder: _buildVideosArea)),
_canHideMenuBar || widget.floatingButtons
? Container()
: _buildFooterArea()
],
);
}
@ -536,7 +544,7 @@ class _CallScreenState extends SafeState<CallScreen> {
return Stack(
fit: StackFit.expand,
children: [
// Remove peers videos
// Remote peers videos
Column(
children: rows,
),
@ -547,7 +555,10 @@ class _CallScreenState extends SafeState<CallScreen> {
: Container(),
// Buttons bar
_canHideMenuBar ? Container() : _buildFooterArea()
_canHideMenuBar || !widget.floatingButtons
? Container()
: Positioned(
bottom: 10, right: 0, left: 0, child: _buildFooterArea())
],
);
}
@ -562,16 +573,15 @@ class _CallScreenState extends SafeState<CallScreen> {
height: 50,
width: 50,
right: 10,
bottom: (_canHideMenuBar ? 10 : 80),
bottom: (_canHideMenuBar || !widget.floatingButtons ? 10 : 80),
);
}
/// Footer area
Widget _buildFooterArea() {
return Positioned(
bottom: 10,
right: 0,
left: 0,
return Container(
color: !widget.floatingButtons ? Colors.black : null,
height: !widget.floatingButtons ? 40 : null,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
@ -582,6 +592,7 @@ class _CallScreenState extends SafeState<CallScreen> {
icon: Icon(_isLocalStreamVisible
? Icons.visibility
: Icons.visibility_off),
roundedButtons: widget.floatingButtons,
onPressed: () => _toggleLocalStreamVisibility(),
),
@ -590,12 +601,14 @@ class _CallScreenState extends SafeState<CallScreen> {
onPressed: () => _toggleStreaming(false),
icon: Icon(
isStreamingAudio && !isAudioMuted ? Icons.mic : Icons.mic_off),
roundedButtons: widget.floatingButtons,
),
// Hang up call
_FooterButton(
width: 60,
icon: Icon(Icons.phone),
roundedButtons: widget.floatingButtons,
bgColor: Colors.red.shade900,
onPressed: () => _leaveCall(),
),
@ -606,6 +619,7 @@ class _CallScreenState extends SafeState<CallScreen> {
icon: Icon(isStreamingVideo && !isVideoMuted
? Icons.videocam
: Icons.videocam_off),
roundedButtons: widget.floatingButtons,
onPressed: () => _toggleStreaming(true),
),
@ -624,7 +638,11 @@ class _CallScreenState extends SafeState<CallScreen> {
child: Text(tr("Stop streaming")),
value: _PopupMenuOption.STOP_STREAMING)
],
child: _FooterButton(icon: Icon(Icons.menu), onPressed: null),
child: _FooterButton(
icon: Icon(Icons.menu, color: Colors.white),
onPressed: null,
roundedButtons: widget.floatingButtons,
),
onSelected: (d) => _handleSelectedMenuOption(d),
)
],
@ -639,22 +657,28 @@ class _FooterButton extends StatelessWidget {
final bool visible;
final double width;
final Color bgColor;
final bool roundedButtons;
const _FooterButton(
{Key key,
@required this.icon,
@required this.onPressed,
this.visible = true,
this.width = 45,
this.bgColor = Colors.black})
: assert(icon != null),
const _FooterButton({
Key key,
@required this.icon,
@required this.onPressed,
this.visible = true,
this.width = 45,
this.bgColor = Colors.black,
@required this.roundedButtons,
}) : assert(icon != null),
assert(visible != null),
assert(roundedButtons != null),
super(key: key);
@override
Widget build(BuildContext context) {
if (!visible) return Container();
return Padding(
return roundedButtons ? _buildFAB() : _buildRectangleButton();
}
Widget _buildFAB() => Padding(
padding: const EdgeInsets.only(left: 6, right: 6),
child: Container(
width: width,
@ -664,7 +688,12 @@ class _FooterButton extends StatelessWidget {
onPressed: onPressed == null ? null : () => onPressed(),
backgroundColor: bgColor,
),
),
);
}
));
Widget _buildRectangleButton() => MaterialButton(
onPressed: onPressed,
child: icon,
color: bgColor,
textColor: Colors.white,
);
}

View File

@ -41,7 +41,12 @@ class _CallWindowWidgetState extends State<CallWindowWidget> {
left: _left,
top: _top,
child: Draggable(
child: Card(child: CallScreen(convID: widget.convID)),
child: Card(
child: CallScreen(
convID: widget.convID,
floatingButtons: false,
),
),
feedback: Container(
width: _WindowSize.width,
height: _WindowSize.height,