Add translucent effect
@@ -236,13 +236,6 @@ class _MeetingPageState extends State<MeetingPage> {
return OrientationBuilder(builder: (context, orientation) {
return SafeArea(
child: Scaffold(
- appBar: orientation == Orientation.portrait
- ? AppBar(
- title: Text('Ion Flutter Demo'),
- centerTitle: true,
- automaticallyImplyLeading: false,
- )
- : null,
body: Consumer<ClientProvider>(builder: (BuildContext context,
ClientProvider clientProvider, Widget child) {
_videoRendererAdapters = clientProvider.videoRendererAdapters;
@@ -272,7 +265,7 @@ class _MeetingPageState extends State<MeetingPage> {
),
Positioned(
right: 10,
- top: 10,
+ top: 48,
child: Container(
child: _buildLocalVideo(orientation),
),
@@ -299,20 +292,54 @@ class _MeetingPageState extends State<MeetingPage> {
right: 0,
bottom: 0,
height: 48,
- child: Card(
- elevation: 0.0,
- shape: RoundedRectangleBorder(
- borderRadius: BorderRadius.circular(0.0),
+ child: Stack(
+ children: <Widget>[
+ Opacity(
+ opacity: 0.5,
+ child: Container(
+ color: Colors.black,
+ ),
),
+ Container(
margin: EdgeInsets.all(0.0),
- color: Colors.black87,
child: Row(
mainAxisSize: MainAxisSize.max,
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ mainAxisAlignment:
+ MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: _buildTools(),
),
),
+ ],
+ ),
+ ),
+ Positioned(
+ left: 0,
+ right: 0,
+ top: 0,
+ height: 48,
+ child: Stack(
+ children: <Widget>[
+ Opacity(
+ opacity: 0.5,
+ child: Container(
+ color: Colors.black,
+ ),
+ ),
+ Container(
+ margin: EdgeInsets.all(0.0),
+ child: Center(
+ child: Text(
+ 'Ion Flutter Demo',
+ style: TextStyle(
+ color: Colors.white,
+ fontSize: 18.0,
+ ),
+ ),
+ ),
+ ),
+ ],
+ ),
),
],
),
@@ -368,20 +395,26 @@ class _MeetingPageState extends State<MeetingPage> {
right: 0,
bottom: 0,
width: 48,
- child: Card(
- elevation: 0.0,
- shape: RoundedRectangleBorder(
- borderRadius: BorderRadius.circular(0.0),
+ child: Stack(
+ children: <Widget>[
+ Opacity(
+ opacity: 0.5,
+ child: Container(
+ color: Colors.black,
),
+ ),
+ Container(
margin: EdgeInsets.all(0.0),
- color: Colors.black87,
child: Column(
mainAxisSize: MainAxisSize.max,
- mainAxisAlignment: MainAxisAlignment.spaceBetween,
+ mainAxisAlignment:
+ MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: _buildTools(),
),
),
+ ],
+ ),
),
],
),
