Themes in Flutter: Part 2
Hi, this is 2nd part of Themes in Flutter series.
Find part 1 here: [Published URL]
In the 1st part, we saw 15 parameters of ThemeData class. Those were brightness, visualDensity, primaryColor, primaryColorBrightness, primaryColorLight, primaryColorDark, canvasColor, ascentColor, ascentColorBrightness, scaffoldNBackgroundColor, bottomAppBarColor, cardColor, dividerColor, focusColor.
Let’s start with 2nd set of ThemeData parameters.
16. Color hoverColor:
The hover color is used to indicate when a pointer is hovering over a component or widget.
It can be more useful in the website and desktop version of flutter.
17. Color hightlightColor:
The highlight color is used to show if something is selected. The highlight color is used during ink splash animations or to indicate an item in a menu is selected.
18. Color splashColor:
The splash color is visible when we tap on ink. It is the color of ink splashes.
19. InteractiveInkFeatureFactory splashFactory:
This special object defines the appearance of ink splashes produced by Inkwell and InkResponse.
This is a much-advanced way to handle ink splashes. We will cover in any other article.
20. Color selectedRowColor:
The selectedRowColor is used to highlight selected rows.
21. Color unselectedWidgetColor:
The color used for widgets that are inactive (but enabled) state. For example, an unchecked checkbox. Usually contrasted with the accent color.
22. Color disabledColor:
The color used for widgets that are inoperative and the user can’t interact with it regardless of its state
For eg. it is the color of the disabled checkbox which may be checked or unchecked.
23. ButtonThemeData buttonTheme:
This provides default configurations of button widgets, like RaisedButton, FlatButton. We can provide a theme to all buttons through buttonTheme.
24. ToggleButtonsThemeData toggleButtonsTheme:
This provides default configurations of ToggleButton widgets. We can provide a theme to all types of toggle buttons with toggleButtonsTheme.
25. Color buttonColor:
This is the default fill color (view color) of material buttons like RaisedButton.
Specify this color in the theme of MaterialApp and all raised buttons will adapt this color automatically.
26. Color secondaryHeaderColor:
This is the color of the header of a PaginatedDataTable when there are any selected rows.
27. Color textSelectionColor:
This is the color of text selections of text fields such as TextFields.
28. Color cursorColor:
This is the color of the cursor of Material Styled text fields such as TextField.
29. Color textSelectionHandleColor:
This is the color of the handles used to adjust what part of the text is currently selected.
30. Color backgroundColor:
This is a color that contrasts with the primary color. It is used to show the remaining parts of a progress bar.
31. Color dialogBackgroundColor:
This is the background color of dialog elements.
32. Color indicatorColor:
This is an indicator color of a selected tab in the tab bar.
33. Color hintColor:
This is the color of hint texts or placeholder text color in TextFields.
34. Color errorColor:
The color to use for input validation errors e.g. in TextField fields.
35. Color toggleableActiveColor:
This color is used to highlight the active states of toggleable widgets like Switch, Radio, and Checkbox.
36. TextTheme textTheme:
Text with color that contrasts with the card and canvas colors.
37. TextTheme primaryTextTheme:
This is a text theme that contrasts with the primary color.
38. TextTheme accentTextTheme:
This is a text theme that contrasts with the accent color.
39. InputDecorationTheme inputDecorationTheme:
The default InputDecoration values for InputDecorator, TextField, and TextFormField are based on this theme.
40. IconThemeData iconTheme:
This is an icon theme that contrasts with the card and canvas colors.
41. IconThemeData primaryIconTheme:
This is an icon theme that contrasts with the primary Color.
42. IconThemeData accentIconTheme:
This is an icon theme that contrasts with the accent color.
We will see other objects of the theme in part 3.
Till then try these themes and tell me if it was easy to make the app’s theme or not!
Part 3 with a youtube video is coming up. Keep subscribed on youtube and medium for updates.
If you enjoyed this blog, let me know in the comments below how much useful this blog was to you. I’d be very grateful if you’d help it spread by emailing it to a friend or sharing it on Twitter or Facebook. Thank you!
#HappyCoding #flutter #widgets #crossplatform #tutorial #firebase #viveky259 #procoach
