Skip to content

Commit

Permalink
Improve UI: Home-like background
Browse files Browse the repository at this point in the history 
(issue gumbarros#25)
[gumbarros#25]

* added background for all view widget

* changed the `HomeBackground` widget name to `Background`
 - reason: not just home background anymore

* made the favourites app bar background color to transparent
 - reason : to be consistent with settingsView and charts
  • Loading branch information
@johnjamespj
johnjamespj committed Oct 5, 2020
1 parent b3b028e commit d082fd5
Show file tree
Hide file tree
Showing 13 changed files with 704 additions and 629 deletions.
69 changes: 38 additions & 31 deletions lib/views/charts/chartsView.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,46 +3,53 @@ import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:kepler/cupertinoPageRoute.dart';
import 'package:kepler/views/charts/orbitChartView.dart';
import 'package:kepler/widgets/backgrounds/background.dart';
import 'package:kepler/widgets/cards/imageCard.dart';
import 'package:kepler/widgets/header/header.dart';

class ChartsView extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
slivers: [
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => Column(
children: [
Header('Charts', () => Navigator.of(context).pop()),
Padding(
padding: const EdgeInsets.only(
left: 16.0,
right: 16.0,
top: 8.0,
),
child: ColorsCard(
colorList: [Colors.blue[100], Colors.green[100]],
text:
"Orbit Size Ranking", //TODO - LOCALIZE - ORBIT SIZE RANKING
onTap: () {
Navigator.of(context).push(
route(
OrbitChartView(),
),
);
},
),
return Stack(
children: [
Background(),
Scaffold(
backgroundColor: Colors.transparent,
body: CustomScrollView(
slivers: [
SliverList(
delegate: SliverChildBuilderDelegate(
(context, index) => Column(
children: [
Header('Charts', () => Navigator.of(context).pop()),
Padding(
padding: const EdgeInsets.only(
left: 16.0,
right: 16.0,
top: 8.0,
),
child: ColorsCard(
colorList: [Colors.blue[100], Colors.green[100]],
text:
"Orbit Size Ranking", //TODO - LOCALIZE - ORBIT SIZE RANKING
onTap: () {
Navigator.of(context).push(
route(
OrbitChartView(),
),
);
},
),
),
],
),
],
childCount: 1,
),
),
childCount: 1,
),
],
),
],
),
),
],
);
}
}
39 changes: 23 additions & 16 deletions lib/views/charts/orbitChartView.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import 'package:kepler/controllers/chartsController.dart';
import 'package:kepler/cupertinoPageRoute.dart';
import 'package:kepler/database/database.dart';
import 'package:kepler/models/planetData.dart';
import 'package:kepler/widgets/backgrounds/background.dart';
import 'package:kepler/widgets/header/header.dart';
import 'package:kepler/widgets/progress/loading.dart';
import 'package:syncfusion_flutter_charts/charts.dart';
Expand All @@ -28,23 +29,29 @@ class OrbitChartView extends StatelessWidget {
return GetBuilder<ChartsController>(
init: ChartsController(),
builder: (controller) {
return Scaffold(
//TODO - make this a custom scroll view with a sliver header and a sliver view
body: ListView(
children: [
Header(
this.title,
() => Navigator.of(
context,
).pop(
context,
),
return Stack(
children: [
Background(),
Scaffold(
backgroundColor: Colors.transparent,
//TODO - make this a custom scroll view with a sliver header and a sliver view
body: ListView(
children: [
Header(
this.title,
() => Navigator.of(
context,
).pop(
context,
),
),
OrbitBuilder(
future: planetsOrbits,
)
],
),
OrbitBuilder(
future: planetsOrbits,
)
],
),
),
],
);
});
}
Expand Down
39 changes: 23 additions & 16 deletions lib/views/charts/orbitChartViewRemix.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:get/get.dart';
import 'package:kepler/controllers/chartsController.dart';
import 'package:kepler/widgets/backgrounds/background.dart';
import 'package:kepler/widgets/charts/orbitChart.dart';
import 'package:kepler/widgets/header/header.dart';

Expand All @@ -11,24 +12,30 @@ class OrbitChartView extends StatelessWidget {
return GetBuilder<ChartsController>(
init: ChartsController(),
builder: (controller) {
return Scaffold(
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Header(
"Orbit Comparison", //TODO - LOCALIZE - ORBIT COMPARISON
() => Navigator.of(
context,
).pop(
context,
),
return Stack(
children: [
Background(),
Scaffold(
backgroundColor: Colors.transparent,
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Header(
"Orbit Comparison", //TODO - LOCALIZE - ORBIT COMPARISON
() => Navigator.of(
context,
).pop(
context,
),
),
OrbitChart(title: "Smallest Planet Orbits (Days)", orderBy: "asc",),
OrbitChart(title: "Largest Planet Orbits (Years)", orderBy: "desc")
],
),
OrbitChart(title: "Smallest Planet Orbits (Days)", orderBy: "asc",),
OrbitChart(title: "Largest Planet Orbits (Years)", orderBy: "desc")
],
),
),
),
],
);
});
}
Expand Down
141 changes: 74 additions & 67 deletions lib/views/dailyImage/dailyImageView.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import 'package:get/route_manager.dart';
import 'package:kepler/controllers/dailyImageController.dart';
import 'package:kepler/controllers/planetController.dart';
import 'package:kepler/models/dailyImageData.dart';
import 'package:kepler/widgets/backgrounds/background.dart';
import 'package:kepler/widgets/header/header.dart';
import 'package:kepler/widgets/progress/loading.dart';

Expand All @@ -17,75 +18,81 @@ class DailyImageView extends StatelessWidget {
width: Get.width,
child: GetBuilder<DailyImageController>(
init: new DailyImageController(),
builder: (_) => Scaffold(
resizeToAvoidBottomPadding: false,
body: FutureBuilder<DailyImageData>(
future: _.getImageOfTheDay(),
builder: (BuildContext context,
AsyncSnapshot<DailyImageData> snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.waiting:
case ConnectionState.active:
return Loading();
default:
if (snapshot.data.isNull) {
return Loading();
}
return CustomScrollView(
physics: BouncingScrollPhysics(),
slivers: [
SliverAppBar(
shape: ContinuousRectangleBorder(
borderRadius: BorderRadius.only(
bottomRight: Radius.circular(40),
bottomLeft: Radius.circular(40))),
automaticallyImplyLeading: false,
actions: [
IconButton(
icon: Icon(Icons.arrow_back), onPressed: null)
],
stretch: true,
expandedHeight: 250,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
titlePadding: EdgeInsets.only(
top: 10.0, left: 10, right: 40, bottom: 10),
background: ClipRRect(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
child: Image.network(snapshot.data.url)),
title: Text(snapshot.data.title),
stretchModes: [
StretchMode.blurBackground,
StretchMode.fadeTitle,
StretchMode.zoomBackground
],
),
),
SliverList(
delegate: SliverChildListDelegate([
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
),
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Text(snapshot.data.explanation,
style: TextStyle(
fontFamily: "Roboto", fontSize: 20)),
builder: (_) => Stack(
children: [
Background(),
Scaffold(
backgroundColor: Colors.transparent,
resizeToAvoidBottomPadding: false,
body: FutureBuilder<DailyImageData>(
future: _.getImageOfTheDay(),
builder: (BuildContext context,
AsyncSnapshot<DailyImageData> snapshot) {
switch (snapshot.connectionState) {
case ConnectionState.waiting:
case ConnectionState.active:
return Loading();
default:
if (snapshot.data.isNull) {
return Loading();
}
return CustomScrollView(
physics: BouncingScrollPhysics(),
slivers: [
SliverAppBar(
shape: ContinuousRectangleBorder(
borderRadius: BorderRadius.only(
bottomRight: Radius.circular(40),
bottomLeft: Radius.circular(40))),
automaticallyImplyLeading: false,
actions: [
IconButton(
icon: Icon(Icons.arrow_back), onPressed: null)
],
stretch: true,
expandedHeight: 250,
pinned: true,
flexibleSpace: FlexibleSpaceBar(
titlePadding: EdgeInsets.only(
top: 10.0, left: 10, right: 40, bottom: 10),
background: ClipRRect(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
child: Image.network(snapshot.data.url)),
title: Text(snapshot.data.title),
stretchModes: [
StretchMode.blurBackground,
StretchMode.fadeTitle,
StretchMode.zoomBackground
],
),
),
]),
)
],
);
}
}),
SliverList(
delegate: SliverChildListDelegate([
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
),
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Text(snapshot.data.explanation,
style: TextStyle(
fontFamily: "Roboto", fontSize: 20)),
),
),
]),
)
],
);
}
}),
),
],
),
),
);
Expand Down

0 comments on commit d082fd5

Please sign in to comment.