WEBVTT

1
00:00.860 --> 00:03.830
Concluímos nossa classe de dados de item.

2
00:03.830 --> 00:09.740
Agora, vamos voltar à atividade principal
e começar a projetar nosso carrinho.

3
00:10.280 --> 00:12.140
Meu carrinho personalizado.

4
00:12.740 --> 00:19.250
Começarei removendo o título do item e
passarei um parâmetro do tipo item.

5
00:19.280 --> 00:25.940
Item é a classe modal, a classe de dados
ou o modelo para os itens de dados.

6
00:25.940 --> 00:31.100
Removi esse carrinho e o coloquei em outro
carrinho mais profissional.

7
00:31.130 --> 00:35.180
Aqui, darei a ele um preenchimento de
ponto modificador.

8
00:35.210 --> 00:40.220
A largura e o preenchimento máximos seriam
ATP.

9
00:41.180 --> 00:48.470
Agora, dentro do escopo do carrinho, vou
criar uma coluna e as propriedades dessa
coluna serão

10
00:48.470 --> 00:55.610
um modificador e darei a ela um
preenchimento 16 dentro dessa coluna,
criarei uma imagem.

11
00:57.560 --> 01:03.710
O pintor lembre-se de que o pintor de
imagens é um método da biblioteca de
bobinas.

12
01:03.710 --> 01:08.620
Mas, nos próximos vídeos, aprenderemos
sobre a bobina e as bibliotecas de
deslizamento.

13
01:08.620 --> 01:16.870
Mas, por enquanto, usaremos a biblioteca
padrão no Jetpack Compose para

14
01:16.870 --> 01:18.460
essa imagem de ponto de item de recurso de
pintura.

15
01:18.460 --> 01:26.260
Portanto, aqui estou obtendo a imagem da
imagem da descrição do conteúdo do item ou
da imagem do item.

16
01:26.260 --> 01:35.440
Em seguida, criarei um modificador próximo
ao modificador dot fill maximum width.

17
01:35.440 --> 01:44.410
E a altura seria 180 deep content scale
content scale dot crop.

18
01:44.410 --> 01:49.750
Mais tarde, modificaremos essas
propriedades e atributos.

19
01:49.750 --> 01:57.460
Se houver algum erro ou algo melhor, então
vou criar

20
01:57.520 --> 01:59.830
um novo composable chamado spacer com
altura de oito DP.

21
01:59.950 --> 02:07.420
O spacer composable no Jetpack Compose é
uma maneira simples e eficaz de adicionar
espaço entre os elementos da interface do
usuário.

22
02:07.420 --> 02:14.000
Ele funciona como um espaço vazio no
layout, permitindo que você ajuste o

23
02:14.000 --> 02:15.590
espaçamento entre os componentes para
melhorar o design da interface do usuário.

24
02:15.620 --> 02:22.400
O parâmetro modificador é usado para
especificar o tamanho e outras
propriedades do espaçador.

25
02:22.400 --> 02:28.400
Portanto, aqui definimos o modificador do
espaçador como oito dpi.

26
02:28.520 --> 02:36.500
Em seguida, precisamos criar outro
composable, que é o item de texto text dot
title.

27
02:36.500 --> 02:43.160
E o tamanho da fonte seria 22 SP.

28
02:43.340 --> 02:50.060
Em seguida, adicione um modificador de
altura espaçador para dpi.

29
02:50.090 --> 03:00.440
Em seguida, outro item de texto pontua a
descrição com tamanho de fonte igual a 18
sp.

30
03:00.740 --> 03:07.070
Então, o que fizemos aqui foi criar um
cartão que contém uma coluna.

31
03:07.070 --> 03:12.590
Dentro dessa coluna, temos três
composições: a imagem, o texto e o texto.

32
03:12.590 --> 03:19.930
E nós o separamos entre esses compostáveis
por meio

33
03:19.930 --> 03:21.220
de espaçadores, outro novo compostável que
apresentamos neste vídeo.

34
03:21.250 --> 03:26.140
Pronto, podemos exibir uma visualização do
nosso item personalizado.

35
03:26.140 --> 03:29.800
Então, vamos para a função de
visualização.

36
03:29.800 --> 03:34.090
E aqui vamos chamar meu item
personalizado.

37
03:34.090 --> 03:36.040
E aqui precisamos passar um item.

38
03:36.040 --> 03:37.780
Vamos criar outro item.

39
03:37.780 --> 03:40.330
O item um é igual a dois itens.

40
03:40.330 --> 03:49.840
E aqui precisamos passar três parâmetros:
o título Apple, a descrição very healthy e
a imagem

41
03:49.840 --> 03:55.780
que é r dot drawable dot, por exemplo, o
item um do logotipo do aplicativo.

42
03:55.780 --> 03:57.520
E vamos ver isso aqui.

43
03:57.520 --> 04:01.510
Há um erro na geração da visualização.

44
04:01.540 --> 04:03.970
Você pode ignorar os itens.

45
04:04.210 --> 04:08.080
Portanto, precisamos criar os itens aqui
na coluna Lazycolumn.

46
04:08.080 --> 04:15.820
No próximo vídeo, criaremos a lista de
frutas e legumes,

47
04:15.820 --> 04:18.280
adicionaremos os ativos e exibiremos tudo
ao executar o aplicativo.