https://github.com/iamnijat/fancy-intro-carousel-slider
Fancy Intro Carousel Slider package lets you add beautiful intro sliders to your Flutter app.
https://github.com/iamnijat/fancy-intro-carousel-slider
carousel-slider dart flutter pubdev
Last synced: 9 months ago
JSON representation
Fancy Intro Carousel Slider package lets you add beautiful intro sliders to your Flutter app.
- Host: GitHub
- URL: https://github.com/iamnijat/fancy-intro-carousel-slider
- Owner: iamnijat
- License: bsd-3-clause
- Created: 2022-09-21T12:13:30.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2022-09-30T08:47:03.000Z (almost 4 years ago)
- Last Synced: 2024-12-02T09:39:30.974Z (over 1 year ago)
- Topics: carousel-slider, dart, flutter, pubdev
- Language: Dart
- Homepage: https://pub.dev/packages/fancy_intro_carousel_slider
- Size: 41 KB
- Stars: 7
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Fancy Intro Carousel Slider
Fancy Intro Carousel Slider package lets you add beautiful intro sliders to your Flutter app.
## Installation
1. Add the latest version of package to your pubspec.yaml (and run`dart pub get`):
```yaml
dependencies:
fancy_intro_carousel_slider: ^0.0.3
```
2. Import the package and use it in your Flutter App.
```dart
import 'package:fancy_intro_carousel_slider/fancy_intro_carousel_slider.dart';
```
## Example
There are a number of properties that you can modify:
- items
- dotHeight
- activeDot
- disabledDot
- innerPadding
- actionButton
- scrollDirection
- physics
- pageController
```dart
class FancyIntroCarouselSliderScreen extends StatelessWidget {
const FancyIntroCarouselSliderScreen({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: FancyIntroCarouselSlider(
actionButton: Padding(
padding: const EdgeInsets.only(bottom: 20),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: Container(
width: 300,
height: 55,
decoration: AppStyles.mainBlueColorBoxDecorationStyle,
child: const Material(
color: AppPalette.transparentColor,
child: Center(
child: Text("Let's start",
style: AppStyles.whiteColor15spw700NotoSans)),
),
),
),
),
pageController: pageController,
dotHeight: 8,
innerPadding: const EdgeInsets.only(left: 4),
activeDot: AnimatedContainer(
duration: const Duration(milliseconds: 250),
margin: const EdgeInsets.only(right: 7),
height: 8,
width: 19,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30),
color: Colors.blue,
),
),
disabledDot: AnimatedContainer(
duration: const Duration(milliseconds: 250),
margin: const EdgeInsets.only(right: 7),
height: 8,
width: 10,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30),
color: Colors.grey,
),
),
items: [
Column(
children: [
Container(
width: 320,
constraints: const BoxConstraints(maxHeight: 400),
decoration: BoxDecoration(
image: DecorationImage(
image: svg_provider.Svg(img),
fit: BoxFit.fitWidth,
)),
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Text(
title,
textAlign: TextAlign.center,
style: AppStyles.mainHeadlineColorw70020spPoppins,
),
),
const SizedBox(
height: 13,
),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 34),
child: Text(
desc,
textAlign: TextAlign.center,
style: AppStyles.mainHeadlineColorw50012spPoppinsLineHeight,
),
)
],
)
],
),
);
}
}
```
## Next Goals
- [ ] Add animational behaviors to the properties.
- [ ] Add more functionalities to the package.