Skip to content

Instantly share code, notes, and snippets.

@braulio94
Last active June 15, 2021 18:07
Show Gist options
  • Star 10 You must be signed in to star a gist
  • Fork 3 You must be signed in to fork a gist
  • Save braulio94/3ccbeb8c1bb25c33bf5bf16396a00a04 to your computer and use it in GitHub Desktop.
Save braulio94/3ccbeb8c1bb25c33bf5bf16396a00a04 to your computer and use it in GitHub Desktop.
Flutter - Making a gradeint app body background using decoration
import 'package:flutter/material.dart';
//
// Created by Braulio Cassule
// 30 December 2017
//
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
///
/// * I would suggest heading on to
/// * https://material.io/guidelines/style/color.html#color-color-palette
/// * to choose your colors
///
Color gradientStart = Colors.deepPurple[700]; //Change start gradient color here
Color gradientEnd = Colors.purple[500]; //Change end gradient color here
@override
Widget build(BuildContext context) {
return new MaterialApp(
home: new Scaffold(
appBar: new AppBar(
title: new Text('Gradient Decoration'),
),
body: new Container(
decoration: new BoxDecoration(
gradient: new LinearGradient(colors: [gradientStart, gradientEnd],
begin: const FractionalOffset(0.5, 0.0),
end: const FractionalOffset(0.0, 0.5),
stops: [0.0,1.0],
tileMode: TileMode.clamp
),
),
),
),
);
}
}
@braulio94
Copy link
Author

braulio94 commented Dec 29, 2017

The Result should look something like this

device-2017-12-30-014914

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment