Flutter Mobile Apps - Adding Elevation and ShadowColor in Flutter Card
#Flutter #tutorials #mobileapps #androidappswithflutter #ospproprogrammer #mobileapps
Internship Training Join now https://osppro.com?internship-training
Flutter Mobile Apps - Adding Elevation and ShadowColor in Flutter Card
Card is a build-in widget in flutter which derives its design from Google’s Material Design Library. The functionality of this widget on screen is, it is bland space or panel with round corners and a slight elevation on the lower side. It comes with many properties like color, shape, shadow color, etc which lets developers customize it the way they like. Below we will go through al its properties and an example to see its implementation.
Properties of Card Widget:
borderOnForeground: This property takes in a boolean value as an object to decide whether to print a border or not.
child: This property takes in a widget as an object to show inside the Card widget.
clipBehavior: This property decides whether the content inside the Card will be clipped or not. It takes Clip enum as an object.
color: This property assigns background color to the card by taking in the Color class as the object.
elevation: This property takes in a double value as the object to decide the z-coordinate where the card should be placed.
margin: This property takes in EdgeInsetsGeometry as the object to add empty space around the Card.
semanticContainer: This property takes in a boolean as the object. This controls whether the Card widget with all its child widget will be seen as a single widget or not.
shadowColor: This property takes in Color class as the object to assign a color to the shadow, which appears beneath the card. By default, the color is set to black.
shape: This property takes ShapeBorder class as the object to decide the shape of the Card widget.
Видео Flutter Mobile Apps - Adding Elevation and ShadowColor in Flutter Card канала OSP PRO
Internship Training Join now https://osppro.com?internship-training
Flutter Mobile Apps - Adding Elevation and ShadowColor in Flutter Card
Card is a build-in widget in flutter which derives its design from Google’s Material Design Library. The functionality of this widget on screen is, it is bland space or panel with round corners and a slight elevation on the lower side. It comes with many properties like color, shape, shadow color, etc which lets developers customize it the way they like. Below we will go through al its properties and an example to see its implementation.
Properties of Card Widget:
borderOnForeground: This property takes in a boolean value as an object to decide whether to print a border or not.
child: This property takes in a widget as an object to show inside the Card widget.
clipBehavior: This property decides whether the content inside the Card will be clipped or not. It takes Clip enum as an object.
color: This property assigns background color to the card by taking in the Color class as the object.
elevation: This property takes in a double value as the object to decide the z-coordinate where the card should be placed.
margin: This property takes in EdgeInsetsGeometry as the object to add empty space around the Card.
semanticContainer: This property takes in a boolean as the object. This controls whether the Card widget with all its child widget will be seen as a single widget or not.
shadowColor: This property takes in Color class as the object to assign a color to the shadow, which appears beneath the card. By default, the color is set to black.
shape: This property takes ShapeBorder class as the object to decide the shape of the Card widget.
Видео Flutter Mobile Apps - Adding Elevation and ShadowColor in Flutter Card канала OSP PRO
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
![MySQL Shell Complete Course (CRUD) Apps - How to Create, Read, Update & Delete or Drop in MySQL](https://i.ytimg.com/vi/zbSNTLCRfXA/default.jpg)
![Flutter Mobile Apps How to add Elevation to Flutter Bottom Navigation Bar](https://i.ytimg.com/vi/7XBzhx48n5o/default.jpg)
![Flutter Mobile Apps How to add on Tap in Bottom Navigation Bar in Flutter](https://i.ytimg.com/vi/dIm3CN34BQQ/default.jpg)
![Flutter Mobile Apps - how to implement a Date Range Picker App in Flutter](https://i.ytimg.com/vi/eEEB47zroj0/default.jpg)
![Mobile Money system using Functions](https://i.ytimg.com/vi/6O2GaoFXbhU/default.jpg)
![Flutter Mobile Apps How to Navigate to a New Screen on Button Click in Flutter App Development](https://i.ytimg.com/vi/a_s9IGb3qh8/default.jpg)
![#8 How to Use Jquery Events the Easiest way - Jquery Events](https://i.ytimg.com/vi/RchBlkYc-RA/default.jpg)
![How to Design Website using w3css for complete beginners | HTML5 and CSS Libraries](https://i.ytimg.com/vi/S0MCWXURB5g/default.jpg)
![how to install python modules the simpliest way for machine learning](https://i.ytimg.com/vi/oz8DcnqIXrU/default.jpg)
![Thank you for subscribing to OSP PRO Programming Channel](https://i.ytimg.com/vi/QbDkoQBcDJA/default.jpg)
![Web Scrapping | PHP Data Scrapping | PHP MYSQL](https://i.ytimg.com/vi/vRrEuOK46_Y/default.jpg)
![Termux android phone hacking simple tips](https://i.ytimg.com/vi/SM5OvViG8-M/default.jpg)
![PHP MYSQL RESTFUL CRUD API Development -Fetching all data](https://i.ytimg.com/vi/76j7vgwdi5M/default.jpg)
![PHP MYSQL CRUD RESTFUL API Deleting User using API](https://i.ytimg.com/vi/BfONuPpa4jA/default.jpg)
![#8 Spare-parts Management system | Supplier Financial Management department](https://i.ytimg.com/vi/mpHZGTl7gRQ/default.jpg)
![Flutter Mobile Apps - How to Add Widgets in Flutter Apps](https://i.ytimg.com/vi/KsTvtLItBDQ/default.jpg)
![sseremba online school](https://i.ytimg.com/vi/XJUNziOha4E/default.jpg)
![how to download jquery and add into a html or php page](https://i.ytimg.com/vi/2Zqc22l7Hhw/default.jpg)
![React Native How to use Arrays to List Data](https://i.ytimg.com/vi/4H3dDmsnTGk/default.jpg)
![complete loops for any programming language](https://i.ytimg.com/vi/Kjpgi6eAXic/default.jpg)
![#8 Python SQLite3 - How to Delete Data in Sqlite3 DatabaseTable](https://i.ytimg.com/vi/hhUV3kOQe1c/default.jpg)