GridView

3 minutes
Share the link to this page
Copied
  Completed
You need to have access to the item to view this lesson.
One-time Fee
$99.99
List Price:  $139.99
You save:  $40
€92.11
List Price:  €128.95
You save:  €36.84
£79
List Price:  £110.60
You save:  £31.60
CA$135.63
List Price:  CA$189.89
You save:  CA$54.26
A$152.50
List Price:  A$213.51
You save:  A$61
S$134.36
List Price:  S$188.12
You save:  S$53.75
HK$782.24
List Price:  HK$1,095.17
You save:  HK$312.93
CHF 90.03
List Price:  CHF 126.05
You save:  CHF 36.01
NOK kr1,071.43
List Price:  NOK kr1,500.05
You save:  NOK kr428.61
DKK kr686.90
List Price:  DKK kr961.68
You save:  DKK kr274.78
NZ$165.89
List Price:  NZ$232.25
You save:  NZ$66.36
د.إ367.19
List Price:  د.إ514.08
You save:  د.إ146.89
৳10,962.37
List Price:  ৳15,347.75
You save:  ৳4,385.38
₹8,329.89
List Price:  ₹11,662.18
You save:  ₹3,332.29
RM471.95
List Price:  RM660.75
You save:  RM188.80
₦139,650.03
List Price:  ₦195,515.63
You save:  ₦55,865.60
₨27,784.55
List Price:  ₨38,899.49
You save:  ₨11,114.93
฿3,624.68
List Price:  ฿5,074.70
You save:  ฿1,450.02
₺3,219.22
List Price:  ₺4,507.05
You save:  ₺1,287.82
B$497.37
List Price:  B$696.33
You save:  B$198.96
R1,892.69
List Price:  R2,649.84
You save:  R757.15
Лв180.23
List Price:  Лв252.33
You save:  Лв72.09
₩133,970.85
List Price:  ₩187,564.55
You save:  ₩53,593.70
₪365.45
List Price:  ₪511.65
You save:  ₪146.19
₱5,625.38
List Price:  ₱7,875.76
You save:  ₱2,250.38
¥15,126.18
List Price:  ¥21,177.26
You save:  ¥6,051.08
MX$1,667.89
List Price:  MX$2,335.11
You save:  MX$667.22
QR364.33
List Price:  QR510.08
You save:  QR145.74
P1,371.04
List Price:  P1,919.52
You save:  P548.47
KSh13,198.68
List Price:  KSh18,478.68
You save:  KSh5,280
E£4,777.57
List Price:  E£6,688.79
You save:  E£1,911.22
ብር5,674.28
List Price:  ብር7,944.22
You save:  ብር2,269.94
Kz83,679.39
List Price:  Kz117,154.50
You save:  Kz33,475.10
CLP$97,728.22
List Price:  CLP$136,823.42
You save:  CLP$39,095.20
CN¥721.76
List Price:  CN¥1,010.50
You save:  CN¥288.73
RD$5,902.41
List Price:  RD$8,263.61
You save:  RD$2,361.20
DA13,448.48
List Price:  DA18,828.42
You save:  DA5,379.93
FJ$224.75
List Price:  FJ$314.66
You save:  FJ$89.91
Q779.03
List Price:  Q1,090.67
You save:  Q311.64
GY$20,896.29
List Price:  GY$29,255.65
You save:  GY$8,359.35
ISK kr13,751.62
List Price:  ISK kr19,252.82
You save:  ISK kr5,501.20
DH1,006.38
List Price:  DH1,408.98
You save:  DH402.59
L1,764.74
List Price:  L2,470.71
You save:  L705.96
ден5,675.43
List Price:  ден7,945.83
You save:  ден2,270.40
MOP$804.72
List Price:  MOP$1,126.64
You save:  MOP$321.92
N$1,894.31
List Price:  N$2,652.11
You save:  N$757.80
C$3,675.64
List Price:  C$5,146.05
You save:  C$1,470.40
रु13,325.57
List Price:  रु18,656.33
You save:  रु5,330.76
S/369.95
List Price:  S/517.94
You save:  S/147.99
K377.16
List Price:  K528.04
You save:  K150.88
SAR375.02
List Price:  SAR525.05
You save:  SAR150.02
ZK2,674.30
List Price:  ZK3,744.12
You save:  ZK1,069.82
L457.86
List Price:  L641.02
You save:  L183.16
Kč2,326.20
List Price:  Kč3,256.78
You save:  Kč930.57
Ft36,514.89
List Price:  Ft51,122.31
You save:  Ft14,607.42
SEK kr1,054.76
List Price:  SEK kr1,476.71
You save:  SEK kr421.94
ARS$85,616.43
List Price:  ARS$119,866.43
You save:  ARS$34,249.99
Bs690.20
List Price:  Bs966.32
You save:  Bs276.11
COP$388,387.97
List Price:  COP$543,758.70
You save:  COP$155,370.72
₡50,196.77
List Price:  ₡70,277.49
You save:  ₡20,080.71
L2,465.93
List Price:  L3,452.40
You save:  L986.47
₲734,141.46
List Price:  ₲1,027,827.41
You save:  ₲293,685.95
$U3,790.30
List Price:  $U5,306.57
You save:  $U1,516.27
zł397.21
List Price:  zł556.12
You save:  zł158.90
Already have an account? Log In

Transcript

Hello, in this video, I am going to show you how to implement a grid view. It's pretty simple. And it is basically what you think it is it is a grid that you can supposedly can put images in a text in there. I'm going to keep it simple number text. And now the next task, I'm going to experiment, put images in there, any widget you want. That's the beauty of it, you can mix and match and styling however you want to.

So we need to replace this. So the body is on grid view dot 10. And then in here to really mean things that we want. There are a lot of properties and as an extra task, as an extra tax, I recommend that you experiment with it my scroll direction. Now the reverse all of that stuff and I'll provide a link to the official documentation. So you can see you know, see more information but the two that we have, when we cross axis can should basically have the columns There are so couple two for now, but we'll change it so it can demonstrate and then we put children and neither Just a list of widgets.

So if I put text and I'm just gonna say, Hello. So I'm gonna duplicate this a bunch of buttons. That should be enough. Obviously, you probably have different pieces of why'd you know data, you could have a list of a and put the list here instead of doing it like this, but that's totally up to you. And now we have our grid, my thinking doesn't look very good. We have one reason it's all anchored to the top left, that's fine.

Instead of having text, if we could send two widgets widget and inside there, we put a child and we put text now. So I'm going to put Hello still and we are going to basically duplicate that should be enough. If we go across as you can see, just that a little change makes it look a lot better. Obviously you can change you can you know put any of the tunes that you want for center, there isn't much but inside of here, you can put a container in, which could change the background color of it the text color, that is totally up to you, the cross axis can lock that is the number of columns, Nether for free, it is free columns. If I were to put four, we got four columns, etc, etc. to be experimentation with how you want to, you know how you want it to look.

And really, that's all there is to it. What you could also do is generate like a random list of you know, children using the list generate method as another extra task. That's where only you'd have to go. So we just randomize basically what's in here, but you will probably have no a list outside of here lock and list variable here perhaps that gets data when the application knows from a database or some sort of JSON request to a you know, simple HTTP JSON request. Come put that there, but this is the core fundamentals of an GridView. If you have any questions, though, feel free to drop me a message and as usual, I look forward to seeing you in the next video.

Sign Up

Share

Share with friends, get 20% off
Invite your friends to LearnDesk learning marketplace. For each purchase they make, you get 20% off (upto $10) on your next purchase.