Scribd
Upload
32 views

Task 4

This document contains code for an animated image slider app in Flutter. It uses an AnimationController to animate between images in a list, changing the image every 8 seconds. The main.dart file sets up the MaterialApp and home page. The homepage is a StatefulWidget that initializes the AnimationController in initState. It builds a Scaffold with the sliding image in a Container and additional fixed ImageData widgets below. The ImageData widget displays each individual image with an overlaying text label.

Uploaded by

Mayank
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
32 views

Task 4

This document contains code for an animated image slider app in Flutter. It uses an AnimationController to animate between images in a list, changing the image every 8 seconds. The main.dart file sets up the MaterialApp and home page. The homepage is a StatefulWidget that initializes the AnimationController in initState. It builds a Scaffold with the sliding image in a Container and additional fixed ImageData widgets below. The ImageData widget displays each individual image with an overlaying text label.

Uploaded by

Mayank
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Task 4 by Divyam Joshi

Output

Task 5 organised and animation


Main.dart
import 'package:flutter/material.dart';

import 'Homepage.dart';

void main()=>runApp(flutterst1());
class flutterst1 extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home:Homepage()
);
}
}

Homepage.dart
import 'package:flutter/material.dart';

class Homepage extends StatefulWidget {


@override
_HomepageState createState() => _HomepageState();
}

class _HomepageState extends State<Homepage>


with SingleTickerProviderStateMixin {
Animation animation;
AnimationController animationController;
@override
void initState() {
// super.initState();
animationController =
new AnimationController(duration: Duration(seconds: 8), vsync: this);
animation =
IntTween(begin: 0, end: photos.length-1 ).animate(animationController)
..addListener((){
setState(() {
photoindex=animation.value;
});
});

animationController.repeat();
}

int photoindex = 0;
List<String> photos = [

"https://images.unsplash.com/photo-1507629479746-d7ac4064838d?ixlib=rb-1.2.1&ixid=eyJh
cHBfaWQiOjEyMDd9&auto=format&fit=crop&w=400&q=60",

"https://images.unsplash.com/photo-1554579653-1962d18ae5a6?ixlib=rb-1.2.1&ixid=eyJhcHB
faWQiOjEyMDd9&auto=format&fit=crop&w=400&q=60",

"https://images.unsplash.com/photo-1527538079466-b6297ad15363?ixlib=rb-1.2.1&ixid=eyJh
cHBfaWQiOjEyMDd9&auto=format&fit=crop&w=400&q=60",

"https://images.unsplash.com/photo-1542434684-41a0bf4e6cd3?ixlib=rb-1.2.1&ixid=eyJhcHB
faWQiOjEyMDd9&auto=format&fit=crop&w=400&q=60",
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Center(
child: Text(
"Welcome",
style: TextStyle(color: Colors.black),
)),
backgroundColor: Colors.white,
),
body: SingleChildScrollView(
physics: BouncingScrollPhysics(),
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 200,
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(photos[photoindex]),
fit: BoxFit.cover,
),
borderRadius: BorderRadius.circular(8.0)),

),
),
// ImageData(photos[photoindex],"hero"),
ImageData(

"https://images.unsplash.com/photo-1542410613-d073472c3135?ixlib=rb-1.2.1&ixid=eyJhcHB
faWQiOjEyMDd9&auto=format&fit=crop&w=400&q=60",
"Batman"),
ImageData(

"https://images.unsplash.com/photo-1527538079466-b6297ad15363?ixlib=rb-1.2.1&ixid=eyJh
cHBfaWQiOjEyMDd9&auto=format&fit=crop&w=400&q",
"Joker"),
ImageData(

"https://images.unsplash.com/photo-1517249361621-f11084eb8e28?ixlib=rb-1.2.1&ixid=eyJh
cHBfaWQiOjEyMDd9&auto=format&fit=crop&w=400&q=60",
"joker")
],
),
));
}
}

class ImageData extends StatelessWidget {


String image;
String name;
ImageData(this.image, this.name);
@override
Widget build(BuildContext context) {
// TODO: implement build
return Padding(
padding: const EdgeInsets.all(8.0),
child: Container(
height: 200,
decoration: BoxDecoration(
image: DecorationImage(
image: NetworkImage(image),
fit: BoxFit.cover,
),
borderRadius: BorderRadius.circular(8.0)),
child: Align(
alignment: Alignment.bottomCenter,
child: Text(
name,
style: TextStyle(
color: Colors.white, fontWeight: FontWeight.bold, fontSize: 33),
),
),
),
);
}
}

Output with animation


keywords:For Today
Animation , AnimationController,initstate,setstate,inttween(animation lib),Align widget.

You might also like