Skip to content

Instantly share code, notes, and snippets.

@Devlonoah
Created November 18, 2021 22:33
Show Gist options
  • Save Devlonoah/f67d35785ad86143bd883e3926ae9971 to your computer and use it in GitHub Desktop.
Save Devlonoah/f67d35785ad86143bd883e3926ae9971 to your computer and use it in GitHub Desktop.
Using bloc with pageview
import 'package:dots_indicator/dots_indicator.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'bloc/intro_bloc.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Intro',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: BlocProvider(
create: (context) => IntroBloc(),
child: IntroWidget(),
),
);
}
}
class IntroWidget extends StatelessWidget {
const IntroWidget({
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: Stack(
children: [
PageView(
onPageChanged: (index) {
context.read<IntroBloc>().add(IntroPageChanged(index));
},
children: listPages,
),
BlocBuilder<IntroBloc, IntroState>(
builder: (context, state) {
print(state.showSkip);
return Positioned(
top: 10,
right: 20,
child: Visibility(
visible: state.showSkip!,
child: OutlinedButton(
onPressed: () {},
child: const Text(
'Skip',
style: TextStyle(fontSize: 20),
),
),
));
},
),
Positioned(
bottom: 80,
right: 40,
left: 40,
child: BlocBuilder<IntroBloc, IntroState>(
builder: (context, state) {
print(state.pageIndex);
return DotsIndicator(
dotsCount: listPages.length,
position: state.pageIndex!,
);
},
),
)
],
),
),
);
}
}
//List of pages
final listPages = [
const PageOne(),
const PageTwo(),
const PageThree(),
];
class PageOne extends StatelessWidget {
const PageOne({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Center(
child: Text('Page one'),
);
}
}
class PageTwo extends StatelessWidget {
const PageTwo({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Center(
child: Text('Page one'),
);
}
}
class PageThree extends StatelessWidget {
const PageThree({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Center(
child: Text('Page one'),
);
}
}
//Intro Bloc
import 'package:bloc/bloc.dart';
import 'package:meta/meta.dart';
part 'intro_event.dart';
part 'intro_state.dart';
class IntroBloc extends Bloc<IntroEvent, IntroState> {
IntroBloc() : super(IntroState.initial());
@override
Stream<IntroState> mapEventToState(
IntroEvent event,
) async* {
if (event is IntroPageChanged) {
yield state.copyWith(
pageIndex: event.pageIndex.toDouble(),
//2 represent total no of pages -1
//Since index of List starts from 0
showSkip: event.pageIndex == 2,
);
}
}
}
// IntroBloc state
part of 'intro_bloc.dart';
class IntroState {
final double? pageIndex;
final bool? showSkip;
const IntroState({this.pageIndex, this.showSkip});
static IntroState initial() {
return const IntroState(
pageIndex: 0,
showSkip: false,
);
}
IntroState copyWith({double? pageIndex, bool? showSkip}) {
return IntroState(
pageIndex: pageIndex,
showSkip: showSkip,
);
}
}
//IntroBloc event
part of 'intro_bloc.dart';
@immutable
abstract class IntroEvent {}
class IntroPageChanged extends IntroEvent {
final int pageIndex;
IntroPageChanged(this.pageIndex);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment