156 lines
4.6 KiB
Dart
156 lines
4.6 KiB
Dart
|
|
import 'package:flutter/material.dart';
|
|
import 'package:youtube_player_iframe/youtube_player_iframe.dart';
|
|
|
|
import '../../generated/l10n.dart';
|
|
import '../../utils/util_web.dart' if (dart.library.io) '../../utils/util_io.dart';
|
|
import '../../widgets/general/breadcrumbs.dart';
|
|
|
|
class DesktopiGoShowLearnMore extends StatefulWidget {
|
|
final Map<String, dynamic> data;
|
|
const DesktopiGoShowLearnMore(this.data, {Key key}) : super(key: key);
|
|
|
|
@override
|
|
State<StatefulWidget> createState() {
|
|
return DesktopiGoShowLearnMoreState();
|
|
}
|
|
|
|
}
|
|
|
|
class DesktopiGoShowLearnMoreState extends State<DesktopiGoShowLearnMore> {
|
|
double sideSpace = 0;
|
|
double mainSpace = 1200;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
if (MediaQuery.of(context).size.width <= 1200) {
|
|
mainSpace = MediaQuery.of(context).size.width;
|
|
sideSpace = 0;
|
|
} else {
|
|
mainSpace = 1200;
|
|
sideSpace = (MediaQuery.of(context).size.width - 1200) / 2;
|
|
}
|
|
Column col = Column(
|
|
children: [
|
|
Util.showImage(
|
|
'https:${widget.data['image-top']['image']}'
|
|
),
|
|
],
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
mainAxisSize: MainAxisSize.max,
|
|
);
|
|
List<Widget> w = _getContent();
|
|
Wrap wrap = Wrap(
|
|
children: [],
|
|
);
|
|
for (int i = 0; i < w.length; i++) {
|
|
wrap.children.add(w[i]);
|
|
}
|
|
col.children.add(wrap);
|
|
|
|
Widget view = SingleChildScrollView(
|
|
child: Row(
|
|
children: [
|
|
Container(
|
|
width: sideSpace,
|
|
),
|
|
Container(
|
|
width: mainSpace,
|
|
child: col,
|
|
),
|
|
Container(
|
|
width: sideSpace,
|
|
),
|
|
],
|
|
),
|
|
);
|
|
return view;
|
|
}
|
|
|
|
@override
|
|
void initState() {
|
|
super.initState();
|
|
}
|
|
|
|
List<Widget> _getContent() {
|
|
List<Widget> widgets = [];
|
|
for (int i = 0; i < (widget.data['sections'] as List).length; i++) {
|
|
Column col = Column(
|
|
mainAxisAlignment: MainAxisAlignment.start,
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [],
|
|
);
|
|
if ((widget.data['sections'] as List)[i]['image'] != null) {
|
|
col.children.add(
|
|
Container(
|
|
padding: EdgeInsets.only(
|
|
top: 10.0, left: 8.0, right: 8.0, bottom: 8.0),
|
|
child: ClipRRect(
|
|
borderRadius: BorderRadius.circular(20.0),
|
|
child: Util.showImage(
|
|
'https:${(widget
|
|
.data['sections'] as List)[i]['image']['image']}',
|
|
fit: BoxFit.contain,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
} else if (((widget.data['sections'] as List)[i]['youtube_videos'] as List).length > 0) {
|
|
YoutubePlayerController _controller = YoutubePlayerController(
|
|
initialVideoId: '${((widget.data['sections'] as List)[i]['youtube_videos'] as List)[0] as String}',
|
|
params: YoutubePlayerParams(
|
|
playlist: ((widget.data['sections'] as List)[i]['youtube_videos'] as List).length > 1 ?
|
|
((widget.data['sections'] as List)[i]['youtube_videos'] as List).map((e) {
|
|
return '$e';
|
|
}).toList() : [], // Defining custom playlist
|
|
startAt: Duration(seconds: 0),
|
|
showControls: true,
|
|
showFullscreenButton: false,
|
|
),
|
|
);
|
|
col.children.add(
|
|
Container(
|
|
padding: EdgeInsets.only(
|
|
top: 10.0, left: 8.0, right: 8.0, bottom: 8.0,
|
|
),
|
|
child: ClipRRect(
|
|
borderRadius: BorderRadius.circular(20.0),
|
|
child: YoutubePlayerIFrame(
|
|
controller: _controller,
|
|
aspectRatio: 1.7778,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
col.children.add(Container(
|
|
margin: EdgeInsets.only(top: 8.0, left: 8.0, right: 8.0, bottom: 4.0),
|
|
child: Text(
|
|
'${(widget.data['sections'] as List)[i]['title']}',
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 16.0,
|
|
color: Colors.black87,
|
|
),
|
|
),
|
|
));
|
|
col.children.add(Container(
|
|
margin: EdgeInsets.only(top: 4.0, left: 8.0, right: 8.0, bottom: 20.0),
|
|
padding: EdgeInsets.only(bottom: 10.0),
|
|
child: Text(
|
|
'${(widget.data['sections'] as List)[i]['description']}',
|
|
style: TextStyle(
|
|
fontSize: 14.0,
|
|
color: Colors.black38,
|
|
),
|
|
),
|
|
));
|
|
widgets.add(Container(
|
|
width: mainSpace / 2,
|
|
child: col,
|
|
));
|
|
}
|
|
return widgets;
|
|
}
|
|
} |