Chewie Participant :
Get began with the attractive, easy and beautiful video participant implementation in your flutter app with Chewie.
On this a part of the tutorial allow us to see the detailed implementation.
pubspec.yaml :
Add the required dependencies to your challenge.
chewie: ^1.7.4video_player: ^2.8.2
foremost.dart :
import ‘package deal:flutter/materials.dart’;
import ‘package deal:chewie/chewie.dart’;
import ‘package deal:video_player/video_player.dart’;
void foremost() async {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : tremendous(key: key);
@override
Widget construct(BuildContext context) {
WidgetsFlutterBinding.ensureInitialized();
return MaterialApp(
house: Scaffold(
appBar: AppBar(title: const Textual content(“chewie video participant”)),
physique: Column(
youngsters: [
PlayerWidget(),
],
),
),
);
}
}
class PlayerWidget extends StatefulWidget {
@override
_PlayerWidgetState createState() => _PlayerWidgetState();
}
class _PlayerWidgetState extends State<PlayerWidget> {
late VideoPlayerController videoPlayerController;
late ChewieController chewieController;
bool isVideoInitialized = false;
@override
void initState() {
tremendous.initState();
videoPlayerController = VideoPlayerController.networkUrl(Uri.parse(“https://flutter.github.io/assets-for-api-docs/property/movies/butterfly.mp4”));
chewieController = ChewieController(
videoPlayerController: videoPlayerController,
autoPlay: true,
looping: true,
);
videoPlayerController.initialize().then((_) {
setState(() {
isVideoInitialized = true;
});
});
}
@override
void dispose() {
videoPlayerController.dispose();
chewieController.dispose();
tremendous.dispose();
}
@override
Widget construct(BuildContext context) {
return LayoutBuilder(
builder: (context, constraints) {
if (isVideoInitialized) {
return AspectRatio(
aspectRatio: videoPlayerController.worth.aspectRatio,
baby: Chewie(
controller: chewieController,
),
);
} else {
return const CircularProgressIndicator();
}
},
);
}
}