List of video players #9
Comments
|
Hey @vessivanov, sure thing! tl;dr -- you need to create a
The problem you're running into: If you change a single You can convert the Example below: import 'package:chewie/chewie.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
void main() {
runApp(
new ChewieDemo(
controllers: [
new VideoPlayerController(
'https://flutter.github.io/assets-for-api-docs/videos/butterfly.mp4',
),
new VideoPlayerController(
'https://flutter.github.io/assets-for-api-docs/videos/bee.mp4',
)
],
),
);
}
class ChewieDemo extends StatefulWidget {
final String title;
final List<VideoPlayerController> controllers;
ChewieDemo({this.title = 'Chewie Demo', this.controllers});
@override
State<StatefulWidget> createState() {
return new _ChewieDemoState();
}
}
class _ChewieDemoState extends State<ChewieDemo> {
TargetPlatform _platform;
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: widget.title,
theme: new ThemeData.light().copyWith(
platform: _platform ?? Theme.of(context).platform,
),
home: new Scaffold(
appBar: new AppBar(
title: new Text(widget.title),
),
// Create a ListView of Chewie Players
body: new ListView(
// Here's the magic. We convert our List<VideoPlayerController>
// into a List<Widget>.
children: widget.controllers.map((controller) {
return new Container(
margin: new EdgeInsets.symmetric(vertical: 20.0),
// To display a single Video Player, you need to create a `Chewie` Widget.
// Since we want to show multiple videos, each item in the List will
// contain a Chewie player
child: new Chewie(
controller,
aspectRatio: 3 / 2,
autoPlay: true,
looping: true,
),
);
}).toList(),
),
),
);
}
} |
|
@brianegan You are great! Thank you very much! |
|
Sure thing! Let me know if I can help in any other way :) |
|
Hello again! I am a beginner with a flutter and I have one more question. How can I add other items above or below a video. For example, I want to add a card above any video with some information. Do I need to add a I added this code instead ListView and works, but I want both things I'm sorry if I'm cheeky, it's just hard to figure out. |
|
Hey hey, not cheeky at all! No worries if you're starting out and need help :) What you need to do is create a new Class that holds the information you need, then loop over that to create Widgets that contain a class VideoItem {
final String title;
final String description;
final VideoController controller;
VideoItem(this.title, this.description, this.controller);
}You then need to create a List of these items, like so: final List<VideoItem> items = [
new VideoItem(
'The Enchanted Nightingale',
'Music by Julie Gable. Lyrics by Sidney Stein.',
new VideoPlayerController('some url here'),
),
new VideoItem(
'Second item',
'Second description',
new VideoPlayerController('some other url here'),
),
];You then need to convert this Since you want a Card above the |
|
Thanks, I will try this.
На 16.02.2018 г. 17:42 "Brian Egan" <notifications@github.com> написа:
… Hey hey, not cheeky at all! No worries if you're starting out and need
help :)
What you need to do is create a new Class that holds the information you
need. For example:
class VideoItem {
final String title;
final String description;
final VideoController controller;
VideoItem(this.title, this.description, this.controller);
}
You then need to create a List of these items, like so:
final List<VideoItem> items = [
new VideoItem(
'The Enchanted Nightingale',
'Music by Julie Gable. Lyrics by Sidney Stein.',
new VideoPlayerController('some url here'),
),
new VideoItem(
'Second item',
'Second description',
new VideoPlayerController('some other url here'),
),
];
You then need to convert this List<VideoItem> into a List<Widget> just
like we did the first time.
Since you want a Card above the Chewie Widget, you'll need to wrap the
Card and Chewie Widgets in a Column Widget, just like you've got in your
example
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#9 (comment)>, or mute
the thread
<https://github.com/notifications/unsubscribe-auth/AV3fSK2QTakRRNCfXmXeXiBQsoZPNa9tks5tVaH8gaJpZM4SGva3>
.
|
|
I tried to do it, but something shines in red. Can you write me a complete example of a list of items that contain a card and a video player. I tried something like this: |
|
Yo yo, so here's a quick working example of what you're trying to do: It doesn't look great, but demonstrates the technique of:
import 'package:chewie/chewie.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
void main() {
runApp(
new ChewieDemo(
items: [
new VideoItem(
title: 'Fluttering Butterfly',
description: 'A lovely butterfly flapping it\'s wings',
controller: new VideoPlayerController(
'https://flutter.github.io/assets-for-api-docs/videos/butterfly.mp4',
),
),
new VideoItem(
title: 'Beeeeeeeees!',
description: 'Silly little bee',
controller: new VideoPlayerController(
'https://flutter.github.io/assets-for-api-docs/videos/bee.mp4',
),
)
],
),
);
}
class VideoItem {
final String title;
final String description;
final VideoPlayerController controller;
VideoItem({this.title, this.description, this.controller});
}
class ChewieDemo extends StatefulWidget {
final String title;
final List<VideoItem> items;
ChewieDemo({this.title = 'Chewie Demo', this.items});
@override
State<StatefulWidget> createState() {
return new _ChewieDemoState();
}
}
class _ChewieDemoState extends State<ChewieDemo> {
TargetPlatform _platform;
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: widget.title,
theme: new ThemeData.light().copyWith(
platform: _platform ?? Theme.of(context).platform,
),
home: new Scaffold(
appBar: new AppBar(
title: new Text(widget.title),
),
body: new ListView(
children: widget.items.map((item) {
return new Container(
margin: new EdgeInsets.only(bottom: 20.0),
child: new Card(
child: new Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
new Text(
item.title,
style: Theme.of(context).textTheme.title,
),
new Text(
item.description,
style: Theme.of(context).textTheme.subhead,
),
new Chewie(
item.controller,
aspectRatio: 3 / 2,
autoPlay: true,
looping: true,
),
],
),
),
);
}).toList(),
),
),
);
}
} |
|
That's exactly what I needed. Now it's more clear to understand. Thank you so much!!! |
|
Hi, Brain! Everything was fine, but today when I ran the app, I've got an exception: and video players didn't work. Could you help me? Also: |
|
Thanks! A bit busy these next couple days, but I'll take a look when I have time :) |
|
@brianegan thanks for the chewie plugin. I wanted to find out would you be in a position to know how to implement a picture/video frame that shows as the face cover of the video e.g. the way YouTube does it. All videos have a picture/cover which disappears after you click the video and it starts playing. |
|
You can use the PS.: Please open new issues instead of hijacking old ones. |
|
Se puede realizar con chewie una reporduccion de un video con un slider? |
|
Hello @brianegan Can i make this type of list with update and delete functionality if my url comes from a server api and also my list is dynamic i mean the number of video url if yes then it will help-full for me. i try below code list is working perfect but when i try to delete or update action my list will not updated. and this is my video widget |
masewo
pushed a commit
to masewo/chewie
that referenced
this issue
Feb 4, 2021
Fix fluttercommunity#9 deprecated inheritFromWidgetOfExactType
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Is there easy way to make list of video players? I want to show up more than 1 video. I tried this:
But widget.controller gives error with argument type List. Could you help me?
The text was updated successfully, but these errors were encountered: