Skip to content
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
50 commits
Select commit Hold shift + click to select a range
bbc1a61
Add missing title for day 22
triallax May 3, 2020
47463ff
Fix some typos
triallax May 3, 2020
baebb16
Merge branch 'master' into fix-typos
triallax May 3, 2020
1609f51
Merge pull request #5 from mhmdanas/fix-typos
erluxman May 4, 2020
fd00d19
Simplify title
triallax May 4, 2020
d915cbe
Merge remote-tracking branch 'upstream/master' into add-day22-title
triallax May 4, 2020
0faa284
Merge pull request #4 from mhmdanas/add-day22-title
erluxman May 4, 2020
59f455b
added week 5 tips
erluxman May 10, 2020
f88aef8
Merge pull request #6 from erluxman/week_5
erluxman May 10, 2020
a2123c8
added week 6 tips
erluxman May 18, 2020
05af181
Merge branch 'master' of github.com:erluxman/awesomefluttertips into …
erluxman May 18, 2020
364e051
Merge pull request #7 from erluxman/week_6
erluxman May 18, 2020
7dde8d1
added week 7 tips
erluxman May 25, 2020
e171d2f
Merge pull request #9 from erluxman/week_7
erluxman May 25, 2020
dcab2d0
added 7 more tips
erluxman May 31, 2020
a11f362
Merge pull request #10 from erluxman/week_8
erluxman May 31, 2020
ed30f17
completed week9
erluxman Jun 7, 2020
a7ddac6
added flare and SVG sample app demo
erluxman Jun 7, 2020
be55a1c
Merge pull request #11 from erluxman/week_9
erluxman Jun 7, 2020
73bd6ba
added comparing gifs sideby side
erluxman Jun 7, 2020
f1de6e5
Merge pull request #12 from erluxman/week_9
erluxman Jun 7, 2020
8e66c67
started modularizing the tips
erluxman Jun 7, 2020
330f0ba
making links more distinct
erluxman Jun 7, 2020
f9da5c5
changed style for current page
erluxman Jun 7, 2020
4e075b8
separating previous and next tips
erluxman Jun 7, 2020
e663287
separating previous and next tips second page
erluxman Jun 7, 2020
8348567
Fix formatting
erluxman Jun 7, 2020
75b550f
applied formatting to all pages
erluxman Jun 7, 2020
5e72e2d
Merge pull request #13 from erluxman/modularization
erluxman Jun 7, 2020
2c745d2
fixed lint issues
erluxman Jun 7, 2020
ec25ad5
fixed lint issues
erluxman Jun 7, 2020
37e11de
added partial week 10 updates
erluxman Jun 12, 2020
73918b4
Improve adding build badge tip
erluxman Jun 12, 2020
12dd146
added codecoverage tips
erluxman Jun 13, 2020
3423de5
added video link
erluxman Jun 13, 2020
4df8d81
updated video url
erluxman Jun 13, 2020
99a0aca
uploaded week 10 tips
erluxman Jun 14, 2020
40a2e40
Updated Page number
erluxman Jun 14, 2020
dcbe781
Added week 11 tips
erluxman Jun 21, 2020
36b25c7
Update README.md
erluxman Jun 24, 2020
0cea085
Update README.md
erluxman Jun 24, 2020
38e62e3
Added week 12 tips
erluxman Jun 29, 2020
4c50237
Merge branch 'master' of github.com:erluxman/awesomefluttertips
erluxman Jun 29, 2020
609cbb5
Update README.md
erluxman Jul 4, 2020
ab2c351
Added week 13
erluxman Jul 5, 2020
4b0511a
Merge pull request #15 from erluxman/week_13
erluxman Jul 5, 2020
b8c9fef
added week 14
erluxman Jul 12, 2020
4bf25ba
Merge pull request #16 from erluxman/week_14
erluxman Jul 12, 2020
43e2b5c
completed 100th items
erluxman Jul 13, 2020
73071bb
Merge branch 'master' of github.com:erluxman/awesomefluttertips
erluxman Jul 13, 2020
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -90,3 +90,4 @@ How on this earth did I not know about this widget earlier? This is going to sav
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
Binary file added assets/85claycontainer.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/87snippets.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/88emojifab.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/89periodic.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/90_android.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/90_ios.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/91doughh.gif
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions week02.md
Original file line number Diff line number Diff line change
Expand Up @@ -137,3 +137,4 @@ FractionallySizedBox is build exactly for that use case. Just give it the fracti
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week03.md
Original file line number Diff line number Diff line change
Expand Up @@ -144,3 +144,4 @@ But From dart 2.3 and above, we can use Spread Operator (`...`) to add collectio
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week04.md
Original file line number Diff line number Diff line change
Expand Up @@ -199,3 +199,4 @@ The following animation is done with just `AnimatedContainer()`
[__`Tips 57-63`__](week09.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week05.md
Original file line number Diff line number Diff line change
Expand Up @@ -224,3 +224,4 @@ _Dev tools page_
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week06.md
Original file line number Diff line number Diff line change
Expand Up @@ -208,3 +208,4 @@ We can use ShapeBorder to give outline to widgets or Clip them on it's shape. Th
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week07.md
Original file line number Diff line number Diff line change
Expand Up @@ -249,3 +249,4 @@ ___`Widget/Image()`___ -Inside-> ___`ClipRRect()`___ -Inside-> ___`Container()`_
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week08.md
Original file line number Diff line number Diff line change
Expand Up @@ -166,3 +166,4 @@ From dart 2.8 onwards, the command `pub outdated` gives you the overview of your
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week09.md
Original file line number Diff line number Diff line change
Expand Up @@ -166,3 +166,4 @@ Image.network | CachedNetworkImage

[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
3 changes: 2 additions & 1 deletion week10.md
Original file line number Diff line number Diff line change
Expand Up @@ -195,5 +195,6 @@ Just give the animation `duration` & the updated `TextStyle`. `AnimatedDefaultTe
[__`<< Previous`__](week09.md)
[___`Tips 64-70`___](week10.md)
[__`Next >>`__](week11.md)
[__`Tips 78-84`__](week12.md)

[__`Tips 78-84`__](week12.md)
[__`Tips 85-91`__](week13.md)
2 changes: 2 additions & 0 deletions week11.md
Original file line number Diff line number Diff line change
Expand Up @@ -109,3 +109,5 @@ Do you want pause program flow for a certain duration? You can use `Future.delay
[__`<< Previous`__](week10.md)
[___`Tips 71-77`___](week11.md)
[__`Next >>`__](week12.md)

[__`Tips 85-91`__](week13.md)
1 change: 1 addition & 0 deletions week12.md
Original file line number Diff line number Diff line change
Expand Up @@ -197,3 +197,4 @@ Alice records Http request,payload & response which can be viewed in simple UI (

[__`<< Previous`__](week11.md)
[___`Tips 78-84`___](week12.md)
[__`Next >>`__](week13.md)
208 changes: 208 additions & 0 deletions week13.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,208 @@
# Tips 85-91

## #Day85 Neumorphic Design with `clay_containers`

`clay_containers` makes it easy to build Neumorphic UI.

1. Add dependency

dependencies:
clay_containers: ^version

2. Start using

ClayContainer(
color: baseColor,
height: 200,
width: 200,
child:Center(child:newChild) //Put child inside Center to align it centrally.
depth:45, // negative elevation(both +ve & -ve)
curveType: CurveType.convex, //Curve of surface (concave, convex, plane)
borderRadius: 200,
)

![clay](assets/85claycontainer.png)

[see xbox controller demo](https://github.com/erluxman/clay_container_demo)

[visit clay_containers](https://pub.dev/packages/clay_containers#-readme-tab-)

## #Day 86 `provider`

Passing an object/bloc from a parent widget to it's children across the widget tree by passing it through every Widget constructor between parent and the reciever child is hard.

With `provider` you can easily pass object/bloc from parent to any widget below it in widget tree.

1. Add dependency

```dart
provider: ^4.1.3
```

2. Pass object/model/bloc from Parent Widget by wrapping any widget with Provider.

```dart
@override
Widget build(BuildContext context) {
return Provider(
create:(_)=> User("erluxman"),
child: ScreenA(
child:ScreenB(
child:ScreenC(),
),
),
);
}

class User{
String name;
User(this.name);
}
```

3. Recieve object/model/bloc/ by calling `Provider.of<ObjectType>(context)`

```dart
class ScreenC extends StatelessWidget {
@override
Widget build(BuildContext context) {
User user = Provider.of<User>(context);
print(user.name); //erluxman
return Container(
child: Center(
child: Text(user.name), //erluxman
),
);
}
}
```

[visit provider](https://pub.dev/packages/provider)

## #Day87 Flutter Sinppets

Using Flutter snippets helps gain speed and become productive by eliminating the time typing the boilerplate code by autocompleting various snippets.

[for android studio](https://plugins.jetbrains.com/plugin/12348-flutter-snippets)

[for vscode](https://marketplace.visualstudio.com/items?itemName=Nash.awesome-flutter-snippets)

![snippets](assets/87snippets.gif)

## #Day88 Create Emoji FloatingActionButton

When we get too used to using Icon in FloatingActionButton, we tend to forget that we can use various types of widget as FloatingActionButton's child.

We can use emoji Text as Child to FloatingActionButton to get wonderful colorful Fabs without any image.

```dart
FloatingActionButton(
backgroundColor: Colors.white,
child: Text(
"🚀",
textAlign: TextAlign.center,
style: TextStyle(fontSize: 30),),
)
```

[try in codepen](https://codepen.io/erluxman/pen/vYLpgBo)

![emojifab](assets/88emojifab.gif)

## #Day89 Run any task in a periodic interval with `Timer.periodic()`

You can run any task repeatedly in a certain time period like this:

```dart
Timer.periodic(const Duration(seconds: 1), (Timer time) {
setState(() {
// Your code that runs periodically
secondsPast += 1;
});
});
```

[try on codepen](https://codepen.io/erluxman/pen/pogpqxX)

![periodic](assets/89periodic.gif)

## #Day90 Launcher Icon with ease

**Don't want to create launcher Icons for platform and put them in place manually?**

use `flutter_launcher_icons`

1. Add dev dependency (__`remember dev_dependencies`__).

```yml
dev_dependencies:
flutter_launcher_icons: ^0.7.5
```

2. Configure flutter_icons (**`no spaces before flutter_icons:`**)

```yml
flutter_icons:
android: "launcher_icon"
ios: true
image_path: "assets/images/ic_launcher.png" #use your image path
```

3. Generate Icons

```shell
flutter pub run flutter_launcher_icons:main
```

4. Run app

| Android icon |iOS icon|
|--|--|
|![](assets/90_android.png)| ![](assets/90_ios.png) |

[visit flutter_launcher_icons](https://pub.dev/packages/flutter_launcher_icons)

## #91 `dough` package

Want to make Flutter widgets smooshy like Jelly or Dough? Use the package `dough`

1. Add `dough` to dependency
```yml
dependencies:
dough: ^version
```

2. Wrap any widget with `PressableDough()`.

```dart
PressableDough(
child: FloatingActionButton(
onPressed: () {},
child: Text("🧠",style: TextStyle(fontSize: 40)),
),
)
```

3. **Sorry to disappoint but you are already done 😜**

[sample gist](https://gist.github.com/erluxman/1e102548403db046872d7db530e73594)

[visit dough](https://pub.dev/packages/dough#-installing-tab-)

![dough](assets/91doughh.gif)

[___`Tips 1-7`___](README.md)
[__`Tips 08-14`__](week02.md)
[__`Tips 15-21`__](week03.md)
[__`Tips 22-28`__](week04.md)
[__`Tips 29-35`__](week05.md)
[__`Tips 36-42`__](week06.md)
[__`Tips 43-49`__](week07.md)
[__`Tips 50-56`__](week08.md)
[__`Tips 57-63`__](week09.md)
[__`Tips 64-70`__](week10.md)
[__`Tips 71-77`__](week11.md)
[__`Tips 78-84`__](week12.md)

[__`<< Previous`__](week12.md)
[___`Tips 85-91`___](week13.md)