WEBVTT

00:00:00.000 --> 00:00:02.715
>> Olá a todos. Eu sou Olia.

00:00:02.715 --> 00:00:05.310
Sou gerente de programa on.NET equipe.

00:00:05.310 --> 00:00:08.355
Super animado para ser um
parte deste evento.

00:00:08.355 --> 00:00:10.980
Estarei com vocês o dia todo hoje.

00:00:10.980 --> 00:00:14.610
introdução de alto-falantes e
fazendo perguntas com James.

00:00:14.610 --> 00:00:18.930
Acabamos de ouvir um incrível
keynote, muito inspirador.

00:00:18.930 --> 00:00:21.585
Agora, eu estou super animado para apresentar

00:00:21.585 --> 00:00:24.720
nossos próximos palestrantes, Javier e Gerald.

00:00:24.720 --> 00:00:29.230
Eles vão falar sobre
visualizando seus dados.

00:00:29.390 --> 00:00:32.340
>> Olá. Sim, aqui estamos nós.

00:00:32.340 --> 00:00:33.790
>> Olá.

00:00:34.070 --> 00:00:37.640
>> Muito obrigado. Então vamos

00:00:37.640 --> 00:00:40.580
me apenas ir diretamente
e compartilhar minha tela.

00:00:40.580 --> 00:00:44.330
Aqui vamos nós, e ficando
esta sessão começou.

00:00:44.330 --> 00:00:47.105
Então, sim, como já mencionado,

00:00:47.105 --> 00:00:50.060
vamos falar sobre
hoje visualizando seus dados,

00:00:50.060 --> 00:00:51.965
então vamos falar
sobre o CollectionView,

00:00:51.965 --> 00:00:54.725
CarrosselView, um casal
de outras coisas mais.

00:00:54.725 --> 00:00:57.110
Eu acho, David e Maddy

00:00:57.110 --> 00:01:00.290
já compartilhou alguns dos
bondade que vamos mostrar.

00:01:00.290 --> 00:01:02.720
Mas nós vamos fazer o nosso melhor para
dar-lhe um pouco mais

00:01:02.720 --> 00:01:05.375
de um mergulho profundo e mostrar-lhe o que

00:01:05.375 --> 00:01:08.000
é realmente possível com
todos esses controles incríveis

00:01:08.000 --> 00:01:11.195
que estão em Xamarin
Formulários disponíveis hoje.

00:01:11.195 --> 00:01:13.055
Então isso é nós,

00:01:13.055 --> 00:01:17.080
então pelo menos você vai saber
que você vai estar ouvindo.

00:01:17.080 --> 00:01:22.085
Meu nome é Gerald Versluis.
dos Países Baixos,

00:01:22.085 --> 00:01:23.840
e meu bom amigo Javier,

00:01:23.840 --> 00:01:28.280
nós dois somos parte do Xamarin
Equipe de Formulários, Engenheiros de Software.

00:01:28.280 --> 00:01:31.070
Então, sim, estamos criando
algumas das coisas

00:01:31.070 --> 00:01:34.490
que você, espero, gosta de usar.

00:01:34.490 --> 00:01:37.280
Hoje, vamos conversar.
sobre essas coisas, basicamente.

00:01:37.280 --> 00:01:39.245
Temos muito o que cobrir.

00:01:39.245 --> 00:01:42.620
Então nós vamos ter um monte
de diferentes demonstrações combinando

00:01:42.620 --> 00:01:46.495
todos esses controles incríveis e
Características. Então tente acompanhar.

00:01:46.495 --> 00:01:47.690
Se você tiver alguma dúvida,

00:01:47.690 --> 00:01:49.340
por favor, entre em contato com qualquer um de nós,

00:01:49.340 --> 00:01:51.470
Estamos felizes em responder qualquer pergunta.

00:01:51.470 --> 00:01:53.810
Javier e eu trocaremos.
algumas vezes.

00:01:53.810 --> 00:01:55.430
Então, se você ver sua tela

00:01:55.430 --> 00:01:57.470
cintilando ou qualquer coisa
mais engraçado acontecendo,

00:01:57.470 --> 00:01:58.940
não se preocupe, somos todos nós,

00:01:58.940 --> 00:02:01.775
Não é você. Vamos começar.

00:02:01.775 --> 00:02:04.475
Vou falar um pouco.
sobre o CollectionView primeiro,

00:02:04.475 --> 00:02:07.025
e Javier assumirá.

00:02:07.025 --> 00:02:10.250
Sim, como eu disse, nós vamos
alternar um par de vezes.

00:02:10.250 --> 00:02:13.055
Então, sempre que você ouvir um
belo sotaque espanhol,

00:02:13.055 --> 00:02:15.180
então Javier assumiu.

00:02:16.660 --> 00:02:19.265
Vamos começar com o CollectionView.

00:02:19.265 --> 00:02:20.960
CollectionView é basicamente

00:02:20.960 --> 00:02:23.285
o sucessor espiritual
da ListView.

00:02:23.285 --> 00:02:29.155
A ListaVer que todos conhecemos ou você
sabe e amor, todos nós usamos.

00:02:29.155 --> 00:02:31.970
Mas sim, você pode amar
isso, você pode odiá-lo.

00:02:31.970 --> 00:02:35.105
O fato é que precisávamos em
basicamente todos os nossos aplicativos.

00:02:35.105 --> 00:02:36.830
Precisamos mostrar dados em nossos aplicativos,

00:02:36.830 --> 00:02:38.960
que é basicamente o fundamental de

00:02:38.960 --> 00:02:42.290
cada aplicação que você está usando.

00:02:42.290 --> 00:02:45.230
Mas sim, não tem
sido algumas coisas com

00:02:45.230 --> 00:02:47.990
ListView que poderia ser melhorado.

00:02:47.990 --> 00:02:50.615
Então é por isso que nós viemos
com a última visão.

00:02:50.615 --> 00:02:52.940
Nós pegamos todos os aprendizados de

00:02:52.940 --> 00:02:56.390
o ListView e colocá-lo
para este novo controle,

00:02:56.390 --> 00:03:01.730
e você pode usar isso para mostrar
todos os dados em diferentes layouts.

00:03:01.730 --> 00:03:03.320
Você tem mais flexibilidade,

00:03:03.320 --> 00:03:06.545
e acima de tudo é mais
desempenho do que nunca.

00:03:06.545 --> 00:03:11.045
Então você pode ver para baixo
aqui uma pequena amostra,

00:03:11.045 --> 00:03:13.500
onde você pode definir
o CollectionView.

00:03:13.500 --> 00:03:15.680
Isso tudo funciona, é claro, em XAML e

00:03:15.680 --> 00:03:19.580
codificar assim como você é
acostumados a partir de Formas Xamarin.

00:03:19.580 --> 00:03:23.150
Você pode especificar sua fonte de item
assim como no ListView.

00:03:23.150 --> 00:03:26.480
Mas agora, você também pode
especificar o layout dos itens.

00:03:26.480 --> 00:03:27.500
Então você pode especificar,

00:03:27.500 --> 00:03:29.900
você quer que ele vertical
ou horizontal,

00:03:29.900 --> 00:03:33.710
e você também pode dizer que você
talvez queira tê-lo em uma grade.

00:03:33.710 --> 00:03:35.990
Então, sim, já há

00:03:35.990 --> 00:03:39.020
alguma flexibilidade que você pode
ver acontecendo aqui.

00:03:39.020 --> 00:03:41.180
Isso é tudo o que você pode

00:03:41.180 --> 00:03:44.060
usar hoje fora da caixa
com CollectionView.

00:03:44.060 --> 00:03:45.470
Então, se temos vinculações de dados,

00:03:45.470 --> 00:03:47.480
então você pode usar modelos de dados,

00:03:47.480 --> 00:03:49.670
seletores de modelos, é claro.

00:03:49.670 --> 00:03:51.275
Você pode usar os diferentes layouts.

00:03:51.275 --> 00:03:55.175
À direita aqui, você pode ver
o layout da grade, por exemplo.

00:03:55.175 --> 00:03:57.170
Você pode usar a seleção de itens,

00:03:57.170 --> 00:03:59.630
para que você possa clicar em um item em

00:03:59.630 --> 00:04:03.840
o CollectionView e
faça sua mágica nisso.

00:04:03.840 --> 00:04:06.290
Você pode detalhar até um
visão detalhada de lá.

00:04:06.290 --> 00:04:07.715
Temos a vista vazia.

00:04:07.715 --> 00:04:09.875
Então, sempre que você pode misturar isso com

00:04:09.875 --> 00:04:13.370
uma barra de pesquisa e não há
resultados para sua ação de pesquisa,

00:04:13.370 --> 00:04:16.400
você pode aparecer neste vazio
vista sem suor.

00:04:16.400 --> 00:04:20.840
Você não precisa trocar nenhum
vistas em sua própria árvore visual.

00:04:20.840 --> 00:04:23.510
Você pode fazer isso diretamente
do CollectionView.

00:04:23.510 --> 00:04:25.715
Também melhoramos a rolagem.

00:04:25.715 --> 00:04:28.430
Então agora você tem um evento
com muita informação.

00:04:28.430 --> 00:04:30.920
Você pode determinar quão rápido
alguém está rolando,

00:04:30.920 --> 00:04:32.390
para que lado eles estão rolando,

00:04:32.390 --> 00:04:34.865
e nós também teremos
para rolar para o método.

00:04:34.865 --> 00:04:36.770
Então você pode facilmente rolar para

00:04:36.770 --> 00:04:38.900
um certo ponto em
sua CollectionView.

00:04:38.900 --> 00:04:42.530
São só algumas coisas.
que implementamos em

00:04:42.530 --> 00:04:46.730
este incrível novo controle que
é Xamarin Forms agora.

00:04:46.730 --> 00:04:51.695
Então vamos pular rapidamente para
Visual Studio e mostrar algumas demos.

00:04:51.695 --> 00:04:55.450
Espero que lá vamos nós.

00:04:55.450 --> 00:04:57.530
Então aqui temos Visual
Estúdio para Mac.

00:04:57.530 --> 00:04:59.750
Se você nunca viu isso antes,

00:04:59.750 --> 00:05:03.155
você pode apenas usar visual
Estúdio em um Mac agora.

00:05:03.155 --> 00:05:06.140
Vamos só ir primeiro.
em alguma demonstração visual.

00:05:06.140 --> 00:05:09.505
Então eu tenho o iOS
emulador aberto aqui.

00:05:09.505 --> 00:05:12.575
Javier e eu criamos
um pequeno aplicativo de amostra.

00:05:12.575 --> 00:05:17.330
Agora, lembre-se, essas demonstrações são
tiradas do nosso aplicativo de galeria,

00:05:17.330 --> 00:05:19.430
que é parte do
Repositório xamarin Forms,

00:05:19.430 --> 00:05:21.350
onde executamos todos os nossos testes.

00:05:21.350 --> 00:05:25.160
Então, pode não necessariamente
ser um aplicativo bonito,

00:05:25.160 --> 00:05:27.350
mas é funcional, e nós temos

00:05:27.350 --> 00:05:30.290
alguns mais bonito
amostras para mostrar a você.

00:05:30.290 --> 00:05:33.620
Você pode estilizar isso de qualquer maneira que você
quero no final desta sessão.

00:05:33.620 --> 00:05:37.160
Então não fique confuso se ele
não parece totalmente incrível,

00:05:37.160 --> 00:05:39.920
mas se concentrar no que é
funcionalmente acontecendo aqui.

00:05:39.920 --> 00:05:42.320
Então nós basicamente pegamos a agenda,

00:05:42.320 --> 00:05:43.490
e aqui estão todas as coisas diferentes,

00:05:43.490 --> 00:05:44.630
temos o CollectionView,

00:05:44.630 --> 00:05:48.185
o CarrosselView, IndicatorView
e todas as coisas.

00:05:48.185 --> 00:05:51.445
Mas vamos com o
CollectionView agora mesmo.

00:05:51.445 --> 00:05:55.845
Como eu mencionei,
você pode simplesmente ir com

00:05:55.845 --> 00:05:59.600
uma coleção de cordas
nós temos bem aqui.

00:05:59.600 --> 00:06:01.310
É isso?

00:06:01.310 --> 00:06:03.110
Isto é apenas uma coleção de cordas.

00:06:03.110 --> 00:06:05.840
Você ligar isso ao
fonte de item e boom,

00:06:05.840 --> 00:06:08.505
você tem um CollectionView
com cordas.

00:06:08.505 --> 00:06:10.490
Como você pode ver, isso também é

00:06:10.490 --> 00:06:13.130
com a seleção
capacidades habilitadas.

00:06:13.130 --> 00:06:15.560
Então você pode selecionar itens aqui,

00:06:15.560 --> 00:06:17.630
e com base no evento selecionado ou

00:06:17.630 --> 00:06:19.865
o comando que você se liga a isso,

00:06:19.865 --> 00:06:23.160
você poderia ir para o
próxima tela daqui.

00:06:23.360 --> 00:06:26.990
Como você pode ver, há
um monte de coisas aqui,

00:06:26.990 --> 00:06:30.005
então você provavelmente quer
confira isso por si mesmo.

00:06:30.005 --> 00:06:32.944
Todas as funcionalidades são

00:06:32.944 --> 00:06:35.630
listado e você pode
ter uma brincadeira com isso.

00:06:35.630 --> 00:06:38.990
Então, a maioria dessas coisas vai
também têm variância diferente em

00:06:38.990 --> 00:06:42.800
código em talvez XAML e
horizontal, vertical.

00:06:42.800 --> 00:06:45.845
Como eu disse, isso também é
costumava executar nossos testes.

00:06:45.845 --> 00:06:47.660
Então, há um monte de coisas aqui.

00:06:47.660 --> 00:06:49.220
A outra coisa que
Eu quero te mostrar

00:06:49.220 --> 00:06:51.590
aqui que isso combina um
par de coisas que

00:06:51.590 --> 00:06:55.265
Eu falei antes é o
seletor de modelode dados.

00:06:55.265 --> 00:06:59.765
Então este modelo seleciona
sempre que é um dia de semana.

00:06:59.765 --> 00:07:02.780
Ele usa um modelo para
uma vantagem por alguma razão.

00:07:02.780 --> 00:07:07.400
Sempre que é fim de semana, nós
ver este outro ícone aqui.

00:07:07.400 --> 00:07:10.490
Então isso se repete
por um par de vezes.

00:07:10.490 --> 00:07:12.140
Mas você pode facilmente filtrar isso.

00:07:12.140 --> 00:07:14.660
Então, se eu só ir para segunda-feira,

00:07:14.660 --> 00:07:16.580
a descoberta não é realmente otimizada,

00:07:16.580 --> 00:07:17.970
então isso leva um pouco,

00:07:17.970 --> 00:07:19.670
e eu deveria pressionar "Enter",

00:07:19.670 --> 00:07:21.320
você verá todas as segundas-feiras.

00:07:21.320 --> 00:07:24.200
Se procurarmos por algo
que não está aqui,

00:07:24.200 --> 00:07:26.870
então um dia de segunda-feira, você pode ver que isso é

00:07:26.870 --> 00:07:29.720
a vista vazia, porque nós não
tem qualquer resultado de pesquisa aqui.

00:07:29.720 --> 00:07:31.715
Então ele vai aparecer a vista vazia,

00:07:31.715 --> 00:07:35.180
e isso é exatamente o que
você vai sair da caixa

00:07:35.180 --> 00:07:40.210
sempre que sua coleção não
tem quaisquer itens lá dentro.

00:07:40.210 --> 00:07:43.170
Então, o que temos mais?
Claro que isso tudo

00:07:43.170 --> 00:07:45.844
trabalha com coleções observáveis.

00:07:45.844 --> 00:07:48.800
Então você pode apenas tomar
isso e você pode ver

00:07:48.800 --> 00:07:52.490
aqui temos um par de
controles aqui no topo.

00:07:52.490 --> 00:07:54.380
Também temos cabeçalhos e rodapés.

00:07:54.380 --> 00:07:57.410
Eu acho que Javier vai mostrar
você um pouco sobre isso.

00:07:57.410 --> 00:07:59.630
Mas aqui temos itens,

00:07:59.630 --> 00:08:02.210
e porque é um
coleção observável,

00:08:02.210 --> 00:08:05.300
você pode observar quaisquer mudanças que
vai acontecer nesta coleção.

00:08:05.300 --> 00:08:07.580
Então podemos remover um par de aqui,

00:08:07.580 --> 00:08:10.700
e você vê que ele
atualizações automaticamente.

00:08:10.700 --> 00:08:13.970
Sempre que queremos inserir
algumas coisas,

00:08:13.970 --> 00:08:16.550
ele estará aqui inserido na parte superior.

00:08:16.550 --> 00:08:19.070
Eu também posso especificar um
índice diferente para

00:08:19.070 --> 00:08:22.160
inseri-lo em um diferente
posição se eu quiser.

00:08:22.160 --> 00:08:26.705
Então, sim, e eu também posso mover um
algumas dessas coisas ao redor.

00:08:26.705 --> 00:08:32.085
Então você vê que isso funciona instantaneamente.

00:08:32.085 --> 00:08:33.780
Muito performante, parece bom,

00:08:33.780 --> 00:08:37.870
ele tem essa animação fade.
Parece incrível.

00:08:38.820 --> 00:08:41.650
Então, o que temos mais?
Temos pontos de vantagem.

00:08:41.650 --> 00:08:43.510
Isso também é algo
nós introduzimos.

00:08:43.510 --> 00:08:45.310
Então, se você nunca viu isso antes,

00:08:45.310 --> 00:08:47.930
vamos pegar uma lista vertical desta vez.

00:08:48.030 --> 00:08:51.310
Pontos de snap basicamente significam
que sempre que você rolar,

00:08:51.310 --> 00:08:52.690
Quero dizer, agora, não faz nada.

00:08:52.690 --> 00:08:53.800
Mas sempre que selecionamos

00:08:53.800 --> 00:08:57.670
um ponto de pressão aqui e
definimos como obrigatório,

00:08:57.670 --> 00:09:00.520
então você vê sempre que eu rolar
aqui e eu defini-lo para algo,

00:09:00.520 --> 00:09:04.150
ele estala para obter um
certo item e você pode

00:09:04.150 --> 00:09:08.275
influenciar esse comportamento, definindo
aqui o início ou o centro.

00:09:08.275 --> 00:09:10.240
Então, sempre que eu defini-lo para o centro,

00:09:10.240 --> 00:09:11.755
ele vai centralizar um item.

00:09:11.755 --> 00:09:14.740
Então, agora, você vê dois itens aqui,

00:09:14.740 --> 00:09:16.015
mas agora eu começo a rolar,

00:09:16.015 --> 00:09:19.600
e sempre que eu não tenho
um item no centro aqui,

00:09:19.600 --> 00:09:24.430
ele vai se certificar de que ele estala
para um item central aqui.

00:09:24.430 --> 00:09:26.530
Então isso vai parecer
bonito em seus desenhos,

00:09:26.530 --> 00:09:28.390
e você pode fazê-lo
trabalhar de qualquer maneira que você quiser.

00:09:28.390 --> 00:09:30.940
Você pode configurar um casal

00:09:30.940 --> 00:09:33.730
de coisas aqui para torná-lo
trabalhar com o seu projeto.

00:09:33.730 --> 00:09:35.500
Então, o que temos mais?

00:09:35.500 --> 00:09:37.915
Nós também temos que rolar
também, eu já mencionei.

00:09:37.915 --> 00:09:40.480
Novamente, várias opções
aqui para escolher.

00:09:40.480 --> 00:09:43.060
Vamos escolher um.
e podemos dizer: "Ok,

00:09:43.060 --> 00:09:46.570
rolar para índice, por isso temos um
número de itens aqui novamente",

00:09:46.570 --> 00:09:51.175
como eu mencionei, não necessariamente
muito bonita, mas funciona.

00:09:51.175 --> 00:09:54.235
Então, se eu disser rolar para
índice e eu digo 10,

00:09:54.235 --> 00:09:56.065
que não está em vista aqui,

00:09:56.065 --> 00:09:57.385
e eu faço isso,

00:09:57.385 --> 00:09:59.845
então ele vai ter certeza
que rola para 10.

00:09:59.845 --> 00:10:02.470
Porque eu definir o pergaminho para
posição para tornar visível,

00:10:02.470 --> 00:10:03.670
ele só vai torná-lo visível.

00:10:03.670 --> 00:10:05.065
Então será no final agora.

00:10:05.065 --> 00:10:07.900
Mas eu também posso configurar isso para
estar no centro de partida ou fim.

00:10:07.900 --> 00:10:11.275
Então, se eu definir isso para estar no
começar e eu pressiono "Go" novamente,

00:10:11.275 --> 00:10:14.900
ele vai se certificar de que isso
item é apresentado no início.

00:10:17.130 --> 00:10:19.450
O que eu tenho mais?

00:10:19.450 --> 00:10:22.090
[inaudível], nós vamos
para ver isso mais tarde.

00:10:22.090 --> 00:10:23.620
Vista vazia, nós já vimos que

00:10:23.620 --> 00:10:25.510
um pouco e seleção também.

00:10:25.510 --> 00:10:28.015
Mas vamos rapidamente
mergulhar em um presente.

00:10:28.015 --> 00:10:29.980
Temos vários modos de seleção.

00:10:29.980 --> 00:10:33.550
Então você pode ter solteiro ou
múltiplas seleções aqui ou nenhuma,

00:10:33.550 --> 00:10:35.320
que também é uma possibilidade.

00:10:35.320 --> 00:10:37.600
Então, agora, eu posso selecionar qualquer coisa.

00:10:37.600 --> 00:10:39.580
Mas quando eu defini-lo para solteiro,

00:10:39.580 --> 00:10:41.320
então você pode selecionar um
das opções aqui.

00:10:41.320 --> 00:10:43.990
Você pode ver que também
funciona no layout da grade,

00:10:43.990 --> 00:10:49.240
e você pode ver aqui todos os
informações que chegam do evento.

00:10:49.240 --> 00:10:51.520
Também podemos fazer múltiplos.

00:10:51.520 --> 00:10:56.860
Então, agora, você vê que eu
tem uma seleção de múltiplos.

00:10:56.860 --> 00:10:59.230
Eu entraria no código aqui,

00:10:59.230 --> 00:11:02.380
mas eu vejo que eu estou tomando
já há algum tempo,

00:11:02.380 --> 00:11:06.400
então eu acho que eu vou apenas entregá-lo
para Javier agora e Javier

00:11:06.400 --> 00:11:10.360
pode, então, mostrar um pouco
de código e mergulhar nisso.

00:11:10.360 --> 00:11:12.475
Então Javier, leve-o embora.

00:11:12.475 --> 00:11:16.630
>> Eu vou tentar. Então vamos
continuar com mais funcionários

00:11:16.630 --> 00:11:19.330
sobre a visão de coleta, porque em

00:11:19.330 --> 00:11:22.405
fato de que temos uma loucura
quantidade de amostras.

00:11:22.405 --> 00:11:28.900
Então eu não sei exatamente onde
você deixa a amostra.

00:11:28.900 --> 00:11:31.390
Deixe-me executar, neste caso,

00:11:31.390 --> 00:11:35.720
usando androide, qualquer coisa que
você usa com iOS. Então vamos ver.

00:11:39.360 --> 00:11:42.760
>> Eu só vou falar enquanto
você começa esta execução.

00:11:42.760 --> 00:11:44.980
Eu sabia que você ia.
para mostrar o Android.

00:11:44.980 --> 00:11:46.825
Quero dizer, é tudo Formas Xamarin.

00:11:46.825 --> 00:11:49.165
Então, o que quer que implementássemos,

00:11:49.165 --> 00:11:52.600
você pode fazer isso no Android sempre que
o emulador funciona e você

00:11:52.600 --> 00:11:56.365
pode fazê-lo no iOS e ele vai
ambos mostram resultados semelhantes.

00:11:56.365 --> 00:12:02.350
Então, sim, é por isso que eu
optou por fazê-lo no iOS.

00:12:02.350 --> 00:12:07.000
>> Então, eu sinto que eu tenho um
problema com o simulador.

00:12:07.000 --> 00:12:10.150
Eu não sei por que é
não está funcionando. Nada?

00:12:10.150 --> 00:12:12.895
>> Tudo bem. Você quer
me apenas continuar?

00:12:12.895 --> 00:12:16.120
>> Sim. Por favor, continue.
com a demonstração.

00:12:16.120 --> 00:12:17.230
>> Tudo bem.

00:12:17.230 --> 00:12:20.245
>> Eu cometi um erro e eu me preparo

00:12:20.245 --> 00:12:21.925
todas as demonstrações,

00:12:21.925 --> 00:12:23.815
Como uma hora atrás,

00:12:23.815 --> 00:12:28.555
Eu sinto que talvez
não foi a melhor idéia.

00:12:28.555 --> 00:12:33.955
>> De jeito nenhum. Vou preencher o tempo.

00:12:33.955 --> 00:12:35.305
Deixe-me saber quando estiver pronto.

00:12:35.305 --> 00:12:38.845
Então vamos ver.

00:12:38.845 --> 00:12:40.420
Aqui vamos nós. Desculpe pelo.

00:12:40.420 --> 00:12:42.370
telas piscando e
tudo, aqui vamos nós.

00:12:42.370 --> 00:12:44.530
Vamos ver o que quer.
temos mais aqui.

00:12:44.530 --> 00:12:49.555
Então, o que você pode fazer mais com
visão de coleção, temos seleção.

00:12:49.555 --> 00:12:51.220
Você também pode fazer agrupamento.

00:12:51.220 --> 00:12:54.250
Então isso também é algo que você
pode saber a partir da exibição da lista.

00:12:54.250 --> 00:12:56.815
Então aqui temos alguns agrupamentos

00:12:56.815 --> 00:13:00.550
e vejo que temos alguns
super-heróis aqui.

00:13:00.550 --> 00:13:04.270
Isso tem um cabeçalho e
um rodapé por grupo.

00:13:04.270 --> 00:13:08.215
Então aqui temos os Vingadores
com todos os membros lá

00:13:08.215 --> 00:13:10.480
e o Quarteto Fantástico
e os defensores

00:13:10.480 --> 00:13:13.135
e todos os tipos de outros super-heróis.

00:13:13.135 --> 00:13:16.200
Eles são agrupados em um grupo,

00:13:16.200 --> 00:13:19.350
como você esperaria, que é
também algo que você poderia fazer.

00:13:19.350 --> 00:13:20.835
Acho que estamos trabalhando.

00:13:20.835 --> 00:13:24.120
em realmente estalando
esses cabeçalhos de grupo aqui,

00:13:24.120 --> 00:13:27.330
de modo que algo
isso ainda está por vir.

00:13:27.330 --> 00:13:28.860
Mas pelo menos você tem

00:13:28.860 --> 00:13:31.350
a possibilidade de fazer
esses grupos agora.

00:13:31.350 --> 00:13:34.005
Você também pode fazer isso
sem modelos,

00:13:34.005 --> 00:13:37.990
então não parece tão bom.

00:13:37.990 --> 00:13:40.150
Javier, você tem isso.
e correndo novamente porque

00:13:40.150 --> 00:13:42.310
Só estou nadando aqui.

00:13:42.310 --> 00:13:45.080
Vou ao espaçamento do item.

00:13:45.420 --> 00:13:48.250
O que também é algo
que você pode fazer.

00:13:48.250 --> 00:13:51.820
Então vamos usá-lo com um
grid, isso é sempre bom.

00:13:51.820 --> 00:13:54.460
Aqui você pode especificar

00:13:54.460 --> 00:13:57.610
quanto espaço deve haver
entre os diferentes itens.

00:13:57.610 --> 00:14:02.470
Então, se eu começar a jogar aqui
e eu digo 10 e espaçamento de atualização,

00:14:02.470 --> 00:14:04.750
você pode ver que entre as colunas,

00:14:04.750 --> 00:14:07.230
haverá 10 espaçamento.

00:14:07.230 --> 00:14:13.260
Eu também posso fazer isso entre o
linhas porque esta é uma exibição de grade.

00:14:13.260 --> 00:14:16.775
Então, sempre que eu faço isso,

00:14:16.775 --> 00:14:19.510
então você também deve
ver o espaçamento aqui.

00:14:19.510 --> 00:14:21.310
Então isso é algo
que também lhe dará

00:14:21.310 --> 00:14:23.230
mais controle sobre como as coisas

00:14:23.230 --> 00:14:29.030
olhar e para fazê-lo funcionar
com seu design melhor.

00:14:30.000 --> 00:14:33.520
Está bem. Você entendeu?

00:14:33.520 --> 00:14:34.600
>> Eu posso continuar, se você quiser.

00:14:34.600 --> 00:14:36.680
>> Ok. Sim.

00:14:42.270 --> 00:14:46.810
>> Deixe-me trocar a tela.

00:14:46.810 --> 00:14:48.850
Você falou sobre, eu acho,

00:14:48.850 --> 00:14:52.585
espaçamento e, em seguida, podemos continuar
falando sobre todas as coisas,

00:14:52.585 --> 00:14:54.430
como o tamanho do item.

00:14:54.430 --> 00:14:57.370
Há diferentes
opções aqui, mas eu

00:14:57.370 --> 00:15:00.310
quero falar sobre o
item dentro desta estratégia,

00:15:00.310 --> 00:15:04.120
sub propriedade, onde você
pode usar valores diferentes.

00:15:04.120 --> 00:15:07.630
Há um valor que
este é o primeiro item.

00:15:07.630 --> 00:15:11.290
Isso significa que vamos calcular
o tamanho do primeiro item,

00:15:11.290 --> 00:15:15.310
e vamos usar o mesmo
tamanho para todas as células.

00:15:15.310 --> 00:15:18.025
Mas, claro, há

00:15:18.025 --> 00:15:22.015
opções para calcular o tamanho
de todos os tamanhos diferentes,

00:15:22.015 --> 00:15:25.165
como você pode ver em
esta amostra específica,

00:15:25.165 --> 00:15:28.840
todas as vendas de diferentes tamanhos.

00:15:28.840 --> 00:15:30.400
Então, qual é a diferença?

00:15:30.400 --> 00:15:33.820
A diferença nisso
caso é sobre desempenho.

00:15:33.820 --> 00:15:36.985
Se todas as suas células têm um
certo tamanho de distância,

00:15:36.985 --> 00:15:41.080
apenas calcular, uma vez
é algo interessante.

00:15:41.080 --> 00:15:43.930
Então, é claro, nós
já conversaram antes.

00:15:43.930 --> 00:15:45.760
Temos opção para definir

00:15:45.760 --> 00:15:48.265
o cabeçalho eo rodapé
da visão de coleção.

00:15:48.265 --> 00:15:53.740
Podemos usar fluxos simples
mas também podemos usar

00:15:53.740 --> 00:15:57.640
modelos e podemos

00:15:57.640 --> 00:16:01.495
cadeia direta a visibilidade
do cabeçalho e,

00:16:01.495 --> 00:16:04.190
claro, a partir do rodapé.

00:16:05.790 --> 00:16:10.675
O último, e eu acho que
que isso é apenas demonstração,

00:16:10.675 --> 00:16:12.850
bem, [inaudível]
Olhar muito, muito bom,

00:16:12.850 --> 00:16:13.975
mas isso é incrível.

00:16:13.975 --> 00:16:17.545
Dê uma olhada nisso.
desempenho incrível.

00:16:17.545 --> 00:16:19.990
Eu quero parar um pouco em

00:16:19.990 --> 00:16:22.900
a amostra, porque o que
estamos vendo aqui é

00:16:22.900 --> 00:16:26.560
uma Coleção aninhadaView e que

00:16:26.560 --> 00:16:29.860
significa que cada coisa que

00:16:29.860 --> 00:16:33.220
estávamos vendo antes
era o usuário CollectionView,

00:16:33.220 --> 00:16:36.955
onde cada item está
outro CollectionView.

00:16:36.955 --> 00:16:39.550
Então, estamos aninhado todos esses
CollectionViews para criar

00:16:39.550 --> 00:16:44.260
este layout onde
provavelmente você já viu.

00:16:44.260 --> 00:16:47.500
Por exemplo, multimídia
aplicativo, aplicativo de streaming,

00:16:47.500 --> 00:16:49.720
e é muito simples de criar,

00:16:49.720 --> 00:16:53.425
e, sim, funciona muito bem.

00:16:53.425 --> 00:16:58.060
Eu acho que podemos continuar
foco no CollectionView,

00:16:58.060 --> 00:17:01.570
mas vamos pular para outro controle.

00:17:01.570 --> 00:17:06.775
Neste caso, CarrosselView é
outro controle muito bom.

00:17:06.775 --> 00:17:10.720
Um dos pontos muito agradáveis que é

00:17:10.720 --> 00:17:14.515
compartilhando um monte de código
com o CollectionView,

00:17:14.515 --> 00:17:17.530
e por padrão, nós temos
muita funcionalidade

00:17:17.530 --> 00:17:20.755
do CollectionView
trabalhando no CarrosselView.

00:17:20.755 --> 00:17:24.730
Mas vamos ter algum tempo

00:17:24.730 --> 00:17:29.965
com Gerald falando sobre o
CarrosselVer com mais detalhes.

00:17:29.965 --> 00:17:32.545
>> Bem, você já disse tudo.

00:17:32.545 --> 00:17:36.430
Deixe-me ver. Vamos pular
no CarrosselView.

00:17:36.430 --> 00:17:37.960
Assim como Javier já mencionou,

00:17:37.960 --> 00:17:41.050
ele é construído em cima basicamente
da CollectionView.

00:17:41.050 --> 00:17:45.280
Então o CarrosselView é

00:17:45.280 --> 00:17:47.334
basicamente a coisa que você provavelmente

00:17:47.334 --> 00:17:50.530
saber da web e
outros aplicativos populares.

00:17:50.530 --> 00:17:53.815
Então, na maioria das vezes eles apenas
mostrar uma lista horizontal que

00:17:53.815 --> 00:17:57.295
slides telhas ou essas coisas.

00:17:57.295 --> 00:17:59.050
Então acho que netflix, quero dizer,

00:17:59.050 --> 00:18:03.265
estamos todos trabalhando em casa agora
então todos nós sabemos netflix até agora.

00:18:03.265 --> 00:18:05.725
Você tem essas linhas onde você tem

00:18:05.725 --> 00:18:07.510
todos esses CarrosselViews
onde você pode apenas

00:18:07.510 --> 00:18:10.060
rolar por todos os seus
séries e filmes,

00:18:10.060 --> 00:18:14.260
e cada ladrilho é uma série ou filme.

00:18:14.260 --> 00:18:19.150
Então isso é basicamente tudo
CarrosselViews bem ali.

00:18:19.150 --> 00:18:21.220
Isso é o que nós
implementado aqui também.

00:18:21.220 --> 00:18:24.040
Você pode ver um pouco
amostra aqui na parte inferior.

00:18:24.040 --> 00:18:27.625
Então é basicamente apenas
uma visão especializada de

00:18:27.625 --> 00:18:32.680
o CollectionView que tem
um caso de uso muito específico.

00:18:32.680 --> 00:18:34.780
Então você pode usar isso para mostrar

00:18:34.780 --> 00:18:37.555
seus dados em um visual
maneira muito atraente.

00:18:37.555 --> 00:18:41.410
É muito popular em
os aplicativos modernos de hoje.

00:18:41.410 --> 00:18:44.965
É mais adequado para
dados de comprimento limitado.

00:18:44.965 --> 00:18:47.230
Isso não significa que o desempenho é

00:18:47.230 --> 00:18:49.810
algo que não vai
trabalhar para este controle,

00:18:49.810 --> 00:18:53.515
mas é apenas mais adequado
para ainda um número limitado

00:18:53.515 --> 00:18:55.360
de itens em sua coleção

00:18:55.360 --> 00:18:57.880
que você quer que seus usuários
para percorrer.

00:18:57.880 --> 00:19:01.810
Você pode usar um monte de coisas que
também estão no CollectionView.

00:19:01.810 --> 00:19:03.520
Então você também pode usar orientação,

00:19:03.520 --> 00:19:05.620
você também pode usar
layout, se você quiser.

00:19:05.620 --> 00:19:08.575
Modelos de dados serão grandes
para este controle também.

00:19:08.575 --> 00:19:10.600
Ele funciona perfeitamente em conjunto com

00:19:10.600 --> 00:19:13.795
IndicadorVer que vamos
ver um pouco mais tarde.

00:19:13.795 --> 00:19:16.450
Este controle está em pré-visualização agora.

00:19:16.450 --> 00:19:18.445
Então, se você quiser usar isso hoje,

00:19:18.445 --> 00:19:22.990
você pode, mas você precisa ativar
com a bandeira experimental.

00:19:22.990 --> 00:19:26.110
Então você vai ver isso em um par de

00:19:26.110 --> 00:19:30.040
slides mais para outros controles
que estão em pré-visualização também.

00:19:30.040 --> 00:19:33.520
Então lembre-se que
ainda estamos trabalhando nisso.

00:19:33.520 --> 00:19:34.840
Algumas coisas podem mudar,

00:19:34.840 --> 00:19:37.960
mas sim, a maioria dos
coisas devem funcionar.

00:19:37.960 --> 00:19:41.635
Então vamos rapidamente ir e fazer um
pequena demonstração de que também.

00:19:41.635 --> 00:19:44.390
Isso deve funcionar.

00:19:45.480 --> 00:19:49.375
Mais uma vez, eu vou aparecer
para este aplicativo de demonstração aqui.

00:19:49.375 --> 00:19:51.610
Aqui temos o CarrosselView.

00:19:51.610 --> 00:19:52.750
Então esse botão grande,

00:19:52.750 --> 00:19:55.045
não se esqueça de pressionar isso porque

00:19:55.045 --> 00:19:58.255
que permite que o real
bandeira experimental.

00:19:58.255 --> 00:19:59.770
Aqui temos algumas opções.

00:19:59.770 --> 00:20:01.225
Então podemos fazer isso em código,

00:20:01.225 --> 00:20:03.340
horizontal ou vertical, e nós temos

00:20:03.340 --> 00:20:05.860
alguns snap e também um vazio
ver esse tipo de coisa.

00:20:05.860 --> 00:20:09.280
Então vamos ver se conseguimos isso.

00:20:09.280 --> 00:20:12.070
Aqui você pode ver isso
temos cinco itens.

00:20:12.070 --> 00:20:15.070
Eu posso facilmente atualizar isso
a 50 e eu deveria ter

00:20:15.070 --> 00:20:18.265
um monte de mais itens carrossel aqui.

00:20:18.265 --> 00:20:20.740
Então temos uma pequena barra de rolagem aqui.

00:20:20.740 --> 00:20:22.960
Então você pode ver que temos
um monte de itens e você

00:20:22.960 --> 00:20:25.180
pode ver um monte de coisas indo
aqui quando eu estou rolando.

00:20:25.180 --> 00:20:27.835
Então isso dispara o evento de rolagem

00:20:27.835 --> 00:20:30.025
para que você possa ver qual item é visível,

00:20:30.025 --> 00:20:31.270
o primeiro, o último,

00:20:31.270 --> 00:20:33.040
também o Delta e o deslocamento.

00:20:33.040 --> 00:20:35.200
Então foi sobre isso que falei antes.

00:20:35.200 --> 00:20:38.365
Um monte de dados chegando
a partir desse evento de rolagem.

00:20:38.365 --> 00:20:41.110
Além disso, aqui o espaçamento
é apenas algo que você

00:20:41.110 --> 00:20:43.615
pode usar para que você vai ter um
um pouco mais de espaçamento,

00:20:43.615 --> 00:20:45.310
10 não é muito,

00:20:45.310 --> 00:20:46.690
100 é um pouco demais,

00:20:46.690 --> 00:20:51.235
mas você começa a idéia de modo
você pode brincar com isso.

00:20:51.235 --> 00:20:57.085
Além disso, você tem algo que nós
chamar PeekAreaInsets, eu acho.

00:20:57.085 --> 00:21:00.640
Então você pode ver este pouco
itens aqui à esquerda e

00:21:00.640 --> 00:21:02.215
o direito e você pode

00:21:02.215 --> 00:21:04.660
determinar quanto de
esse item que você verá.

00:21:04.660 --> 00:21:08.575
Então parece um pouco engraçado sempre
você muda isso enquanto corre,

00:21:08.575 --> 00:21:11.440
mas você pode ver que você
pode provocar um pouco

00:21:11.440 --> 00:21:14.740
do item que é
anteriormente ou em seguida.

00:21:14.740 --> 00:21:16.540
Você também pode ver que está arrastando.

00:21:16.540 --> 00:21:20.680
Então isso é principalmente para ver se o
usuário está arrastando sim ou não,

00:21:20.680 --> 00:21:23.890
e temos algumas outras propriedades
Como podemos animar isso?

00:21:23.890 --> 00:21:25.210
Podemos roubar isso?

00:21:25.210 --> 00:21:27.549
O salto. Então, basicamente,

00:21:27.549 --> 00:21:29.890
sempre que você chegar ao início
ou o fim da lista,

00:21:29.890 --> 00:21:33.950
ele quica assim ou
ele só ficar parado?

00:21:34.710 --> 00:21:37.075
Claro, também aqui,

00:21:37.075 --> 00:21:39.445
a coisa go-to para que você possa ir para

00:21:39.445 --> 00:21:44.240
um certo item neste CarrosselView.

00:21:46.080 --> 00:21:49.270
Então também aqui, eu vejo que eu tenho uma guia

00:21:49.270 --> 00:21:51.850
abrir para o snap. Sim, desculpe?

00:21:51.850 --> 00:21:54.490
>> pergaminhos, se você

00:21:54.490 --> 00:21:57.715
voltar muito rapidamente para
a lista de amostras,

00:21:57.715 --> 00:22:00.475
você centralizar o
Carrossel verticalView,

00:22:00.475 --> 00:22:05.590
para notar que é mais comum
ter carrossel horizontalView.

00:22:05.590 --> 00:22:09.715
Mas, claro, você pode criar
verticais sem problemas.

00:22:09.715 --> 00:22:13.750
>> Sim, sem problema.
Embora, aqui nós

00:22:13.750 --> 00:22:15.700
tem o mecanismo de estalar para

00:22:15.700 --> 00:22:18.355
isso não tem
qualquer estalo em tudo.

00:22:18.355 --> 00:22:20.260
Desculpe, tem estalos.

00:22:20.260 --> 00:22:23.020
Então eu deveria apenas retardar isso
para baixo e você vai vê-lo.

00:22:23.020 --> 00:22:26.020
Então, sempre que eu não aterrissar
em um item específico,

00:22:26.020 --> 00:22:30.070
ele vai se certificar de que ele vai
vá para o início aqui.

00:22:30.070 --> 00:22:33.550
Mas eu acho que eu tinha um pouco
código aberto para isso aqui.

00:22:33.550 --> 00:22:35.530
Então, para todas essas coisas

00:22:35.530 --> 00:22:37.660
nós fizemos isso tão fácil quanto
possível para você usar.

00:22:37.660 --> 00:22:39.280
Então aqui, você pode apenas dizer,

00:22:39.280 --> 00:22:41.095
faça um novo CarrosselView.

00:22:41.095 --> 00:22:43.270
Você pode especificar qual layout usar.

00:22:43.270 --> 00:22:45.520
Temos alguns predefinidos para você.

00:22:45.520 --> 00:22:49.690
Você pode ser capaz de criar
seus próprios layouts agora.

00:22:49.690 --> 00:22:54.020
Javier, você sabe? Ou talvez nós
permitirá isso no futuro.

00:22:54.210 --> 00:22:56.890
Você pode usar o itemTemplates,

00:22:56.890 --> 00:22:59.230
a cor de fundo
ou os PeekAreaInsets,

00:22:59.230 --> 00:23:02.510
Já mencionei isso.

00:23:02.790 --> 00:23:07.000
Isso é basicamente tudo o que você precisa
fazer para configurar um novo CarrosselView

00:23:07.000 --> 00:23:11.390
e usar tudo isso discreto
características aqui.

00:23:14.340 --> 00:23:16.465
Então IndicadorVer, sim,

00:23:16.465 --> 00:23:18.580
isso é algo que
é firmemente acoplado com

00:23:18.580 --> 00:23:21.055
o CarrosselVer como
Eu já mencionei.

00:23:21.055 --> 00:23:24.775
Então, se você tem o CarrosselView,

00:23:24.775 --> 00:23:26.710
você também pode saber que um monte de

00:23:26.710 --> 00:23:29.410
esses controles têm
este pequenos pontilhados em

00:23:29.410 --> 00:23:31.840
o fundo que mostra

00:23:31.840 --> 00:23:35.680
quantos itens existem
no CarrosselView real,

00:23:35.680 --> 00:23:39.010
mas também, qual índice
atualmente você selecionou.

00:23:39.010 --> 00:23:41.860
Então é isso que queremos
fazer com o IndicadorVer.

00:23:41.860 --> 00:23:44.200
Novamente, também na pré-visualização,

00:23:44.200 --> 00:23:48.625
aqui você vê um pouco
de código de como usar isso.

00:23:48.625 --> 00:23:52.435
Temos as opções para, claro,
fazer algum layout com isso,

00:23:52.435 --> 00:23:54.339
como você quer
centralizar horizontalmente,

00:23:54.339 --> 00:23:58.510
verticalmente, mas também que cor
você quer indicar que seja.

00:23:58.510 --> 00:24:00.760
Qual cor deve ser a
indicador selecionado

00:24:00.760 --> 00:24:04.030
ser e que forma você quer usar.

00:24:04.030 --> 00:24:08.155
Então você pode ver aqui uma pequena amostra,

00:24:08.155 --> 00:24:11.080
neste slide aqui, a cor,

00:24:11.080 --> 00:24:12.310
Eu já mencionei isso,

00:24:12.310 --> 00:24:14.290
a forma, mas você pode
também usar um modelo.

00:24:14.290 --> 00:24:19.180
Então você também pode dar o seu próprio
modelo para o indicador,

00:24:19.180 --> 00:24:20.920
e é claro que você pode dar-lhe um tamanho,

00:24:20.920 --> 00:24:23.305
para que você possa torná-lo maior ou menor.

00:24:23.305 --> 00:24:26.860
Então vamos pular rapidamente
para que também.

00:24:26.860 --> 00:24:29.270
Temos muitas demonstrações.

00:24:30.530 --> 00:24:35.325
Então meu ponteiro do mouse às vezes
desaparece quando eu troco.

00:24:35.325 --> 00:24:39.540
Aqui vamos nós. Então aqui nós
ter o IndicatorView.

00:24:39.540 --> 00:24:41.550
Mais uma vez, não se esqueça de habilitá-lo.

00:24:41.550 --> 00:24:43.290
Isso é muito
galeria direta.

00:24:43.290 --> 00:24:46.020
Nós só temos um. No iOS,

00:24:46.020 --> 00:24:48.270
esquecemos de usar o
salvar coisas da área aqui.

00:24:48.270 --> 00:24:50.400
Então é um pouco
no fundo aqui,

00:24:50.400 --> 00:24:52.740
mas você pode ver, sempre que
Eu vou para o próximo,

00:24:52.740 --> 00:24:56.255
você pode ver o selecionado
aparece para o próximo,

00:24:56.255 --> 00:24:59.440
e isso tudo funciona bem
com o CarrosselView.

00:24:59.440 --> 00:25:04.000
Nós podemos definir isso para
azul, se você quiser,

00:25:04.000 --> 00:25:06.505
e você pode ver que ainda é preto.

00:25:06.505 --> 00:25:08.500
Você pode brincar com o
tamanho aqui um pouco,

00:25:08.500 --> 00:25:11.050
para que você possa torná-lo maior ou minúsculo,

00:25:11.050 --> 00:25:15.370
e você também pode apenas colocá-lo para

00:25:15.370 --> 00:25:17.380
quadrado ou podemos fazer

00:25:17.380 --> 00:25:20.815
um pouco de logotipo Xbox fora de
usando os modelos.

00:25:20.815 --> 00:25:25.195
Isso só funciona no Android que eu vejo.

00:25:25.195 --> 00:25:27.535
Porque isso é provavelmente
usando uma fonte de ícone,

00:25:27.535 --> 00:25:31.510
Javier, que não é adicionado ao uso.

00:25:31.510 --> 00:25:33.730
>> Mas lembre-se que nós chaveed por

00:25:33.730 --> 00:25:37.450
padrão do círculo e do retângulo

00:25:37.450 --> 00:25:41.590
porque são provavelmente o
visualizações indicadoras mais comuns

00:25:41.590 --> 00:25:43.795
usando em aplicações gerais,

00:25:43.795 --> 00:25:47.200
aplicação comum, mas com
o modelo indicador,

00:25:47.200 --> 00:25:49.990
você pode usar outro modelo e definir

00:25:49.990 --> 00:25:54.219
qualquer tipo de conteúdo
dentro de cada indicador.

00:25:54.219 --> 00:25:58.000
>> Sim. Então eu mudei rapidamente
para Android e aqui você pode

00:25:58.000 --> 00:26:01.180
ver que estamos usando isso a coisa pequena

00:26:01.180 --> 00:26:02.950
aqui para também mostrar o modelo.

00:26:02.950 --> 00:26:07.885
Então você pode carregar tudo em
seus indicadores o que você quiser.

00:26:07.885 --> 00:26:12.325
Então, novamente, isso é muito
simples de apenas inicializar.

00:26:12.325 --> 00:26:14.800
Temos o CarrosselView,

00:26:14.800 --> 00:26:17.395
você tem o IndicatorView,

00:26:17.395 --> 00:26:20.245
e então você acabou de dizer
CarrosselView.IndicatorView

00:26:20.245 --> 00:26:21.985
é esse caso aqui,

00:26:21.985 --> 00:26:23.290
e eles serão ligados juntos.

00:26:23.290 --> 00:26:24.340
Ele vai automaticamente saber

00:26:24.340 --> 00:26:27.340
quanto itens existem
com base na fonte do item.

00:26:27.340 --> 00:26:30.760
Uma última coisa que quero notar
rapidamente é o IndicadorVer

00:26:30.760 --> 00:26:33.850
é construído como um controle separado
porque no futuro,

00:26:33.850 --> 00:26:36.025
podemos abri-lo para
outros controles também.

00:26:36.025 --> 00:26:38.830
Agora, você pode usar
para o CarrosselView,

00:26:38.830 --> 00:26:41.155
mas quem sabe o que o
futuro pode trazer?

00:26:41.155 --> 00:26:43.210
Então, desta forma, teremos

00:26:43.210 --> 00:26:46.315
a flexibilidade para também
usá-lo para outros controles.

00:26:46.315 --> 00:26:49.945
>> Tudo bem, Javier, você quer
para falar sobre o RefreshView?

00:26:49.945 --> 00:26:51.610
>> Sim, na verdade.

00:26:51.610 --> 00:26:54.265
Então vamos continuar com mais controles.

00:26:54.265 --> 00:26:58.135
Neste caso, vamos continuar
com o RefreshView.

00:26:58.135 --> 00:27:02.140
Então, especialmente no lançamento,

00:27:02.140 --> 00:27:06.595
um dos padrões comuns em
UX para se referir aos dados é o

00:27:06.595 --> 00:27:11.890
efeito pull-to-refresh que você
sugerem recuperar seus dados.

00:27:11.890 --> 00:27:13.630
Paulo o que é essa coisa de coisas,

00:27:13.630 --> 00:27:16.615
incluímos um novo
controle chamado RefreshView,

00:27:16.615 --> 00:27:21.070
que você coloca como um invólucro
em qualquer conteúdo rolável.

00:27:21.070 --> 00:27:23.800
Esse é o importante.
coisa, porque você

00:27:23.800 --> 00:27:28.640
apenas a maioria atualiza
conteúdo rolável.

00:27:28.710 --> 00:27:30.955
Para usar, é muito fácil.

00:27:30.955 --> 00:27:32.230
No final, como dizemos,

00:27:32.230 --> 00:27:34.750
bloqueamos qualquer controle.

00:27:34.750 --> 00:27:38.410
Neste caso, estamos usando um
ListVer em torno do RefreshView.

00:27:38.410 --> 00:27:40.960
As duas propriedades principais
fica para refrescar.

00:27:40.960 --> 00:27:42.205
É assim que é um booleano,

00:27:42.205 --> 00:27:45.250
que é claro que podemos ligar e

00:27:45.250 --> 00:27:49.300
usar o uso de MVPA e todos os
coisas que provavelmente amam.

00:27:49.300 --> 00:27:52.225
Podemos usar também um comando para

00:27:52.225 --> 00:27:55.735
indicar e executar o
lógica para atualizar a lista.

00:27:55.735 --> 00:27:58.225
Claro, há
também opções relacionadas

00:27:58.225 --> 00:28:00.310
com personalização do controle.

00:28:00.310 --> 00:28:05.005
Então você pode personalizar o que é o
cor do indicador de atualização,

00:28:05.005 --> 00:28:08.425
qual é a cor do
plano de fundo do RefreshView.

00:28:08.425 --> 00:28:11.819
Todas essas coisas, que de novo,

00:28:11.819 --> 00:28:15.300
vamos ver
com uma demonstração rápida.

00:28:15.300 --> 00:28:20.230
Então eu me mudei para a amostra anterior.

00:28:25.530 --> 00:28:31.850
Não sei por que estou perdendo.
que tocam às vezes.

00:28:33.150 --> 00:28:37.104
É uma loucura. Não sei se.
isso é com a apresentação,

00:28:37.104 --> 00:28:43.210
mas você pode ver neste
simulador, o resto está funcionando.

00:28:43.210 --> 00:28:47.180
>> Trabalhar com as botas emulador
muito rapidamente nos dias de hoje, certo?

00:28:48.600 --> 00:28:51.400
>> Agora está funcionando. Eu não sei.

00:28:51.400 --> 00:28:54.295
O. Neste caso,

00:28:54.295 --> 00:28:56.965
temos muitas amostras, mas no final,

00:28:56.965 --> 00:28:58.450
o importante é que você

00:28:58.450 --> 00:29:00.265
pode usar com qualquer conteúdo rolável,

00:29:00.265 --> 00:29:03.190
e isso significa que, claro, você pode

00:29:03.190 --> 00:29:08.080
atualizar qualquer conteúdo que
está usando o ScrollView.

00:29:08.080 --> 00:29:10.975
Claro, você pode usar
ListView, CollectionView,

00:29:10.975 --> 00:29:16.300
e CarrosselVer para acionar
o pull-to-refresh.

00:29:16.300 --> 00:29:18.910
Você pode usá-lo, é claro,

00:29:18.910 --> 00:29:22.030
com o ajustador e também nós

00:29:22.030 --> 00:29:25.330
pode invocar diretamente o
comando para, por exemplo,

00:29:25.330 --> 00:29:28.420
pressionando um botão, mostre

00:29:28.420 --> 00:29:32.305
Indicadoresde vista e
AtualizarVer da mesma forma.

00:29:32.305 --> 00:29:34.480
Claro, também funcionou com

00:29:34.480 --> 00:29:38.590
outros tipos de controles como o WebView.

00:29:38.590 --> 00:29:43.015
Agora, eu acho que isso é
carregando o bloco xamarin,

00:29:43.015 --> 00:29:47.210
e podemos puxar para refrescar.

00:29:47.730 --> 00:29:51.280
Um ponto interessante é que,

00:29:51.280 --> 00:29:54.160
em muitos dos controles
que estamos mostrando hoje,

00:29:54.160 --> 00:29:56.439
somos algumas plataformas específicas.

00:29:56.439 --> 00:29:59.800
Lembre-se que nossa lógica é
específico para alguma plataforma.

00:29:59.800 --> 00:30:01.420
Neste caso, no Windows,

00:30:01.420 --> 00:30:03.400
você pode definir esta detecção branca.

00:30:03.400 --> 00:30:05.500
Você pode deslizar de cima,

00:30:05.500 --> 00:30:07.465
a parte inferior, a esquerda ou a direita.

00:30:07.465 --> 00:30:08.575
Nas outras plataformas,

00:30:08.575 --> 00:30:11.515
ele só funciona a partir do topo por padrão.

00:30:11.515 --> 00:30:13.240
O código é muito simples.

00:30:13.240 --> 00:30:20.720
Vamos pular para provar
para reutilizar com listView.

00:30:27.210 --> 00:30:29.740
Então aqui estamos nós,

00:30:29.740 --> 00:30:33.400
o ListView, é claro,
vinculado à nossa lista de itens,

00:30:33.400 --> 00:30:35.290
e estamos usando o RefreshView.

00:30:35.290 --> 00:30:37.240
Para personalizar o
controle, estamos usando

00:30:37.240 --> 00:30:39.400
o RefreshColor e
Propriedades backgroundColor,

00:30:39.400 --> 00:30:42.100
mas, novamente, o mais
propriedades importantes são

00:30:42.100 --> 00:30:45.610
a propriedade refrescante
e o comando.

00:30:45.610 --> 00:30:48.490
Com o botão que nós
executar o Refresh,

00:30:48.490 --> 00:30:51.070
mas a única coisa que nós
estão fazendo é executar o mesmo

00:30:51.070 --> 00:30:55.400
comando ligado ao
Comando RefreshView.

00:30:55.440 --> 00:30:59.860
Continuando com mais
controles, porque nós

00:30:59.860 --> 00:31:03.985
tem um monte de demonstrações e
mais coisas para revisar,

00:31:03.985 --> 00:31:06.025
vamos ver o SwipeView.

00:31:06.025 --> 00:31:08.500
Da mesma forma que
já vimos antes,

00:31:08.500 --> 00:31:11.320
o RefreshView que permite fazer

00:31:11.320 --> 00:31:14.740
o gesto pull-to-refresh sem

00:31:14.740 --> 00:31:17.650
ser associado com
qualquer controle específico.

00:31:17.650 --> 00:31:18.790
Como vimos antes,

00:31:18.790 --> 00:31:21.025
ele funciona com qualquer
[inaudível] conteúdo.

00:31:21.025 --> 00:31:27.385
Agora, nós temos uma opção em um
lista de itens, por exemplo,

00:31:27.385 --> 00:31:34.975
acesso para executar um específico
ação em um dos itens.

00:31:34.975 --> 00:31:38.725
Para isso estamos permitindo um golpe

00:31:38.725 --> 00:31:42.790
comandando sem precisar
alterar o estado do aplicativo.

00:31:42.790 --> 00:31:45.295
Para fazer isso, introduzimos
o SwipeView,

00:31:45.295 --> 00:31:49.135
o SwipeView nos permite
deslizar em qualquer direção,

00:31:49.135 --> 00:31:51.745
podemos usar também deslizar para cima, para baixo,

00:31:51.745 --> 00:31:53.395
da esquerda, e da direita,

00:31:53.395 --> 00:31:54.970
e temos modos diferentes.

00:31:54.970 --> 00:31:56.200
Deixe-me explicar muito rapidamente

00:31:56.200 --> 00:31:59.350
os dois modos diferentes, porque
eles são muito, muito diferentes.

00:31:59.350 --> 00:32:03.055
Temos em uma mão o modo Revelar,

00:32:03.055 --> 00:32:07.300
neste modo que deslizamos
para abrir o SwipeView.

00:32:07.300 --> 00:32:09.340
Veremos os diferentes comandos,

00:32:09.340 --> 00:32:13.540
e para executar esse comando que precisamos
para tocar explicitamente em um deles.

00:32:13.540 --> 00:32:17.425
No modo Executar
é totalmente diferente,

00:32:17.425 --> 00:32:19.240
só precisamos deslizar,

00:32:19.240 --> 00:32:22.510
e se passarmos o limiar de deslizamento

00:32:22.510 --> 00:32:27.190
o comando associado
com cada item,

00:32:27.190 --> 00:32:28.990
com todos os comandos serão executados,

00:32:28.990 --> 00:32:33.490
e se não apenas o
O SwipeView será fechado.

00:32:33.490 --> 00:32:35.949
Como outros controles anteriores,

00:32:35.949 --> 00:32:38.740
este controle ainda está em pré-visualização

00:32:38.740 --> 00:32:45.930
e isso precisa do uso de
a bandeira experimental.

00:32:45.930 --> 00:32:52.330
Então aqui temos básico
demo usando o SwipeView.

00:32:52.330 --> 00:32:55.045
Claro, o que estamos vendo aqui é

00:32:55.045 --> 00:32:58.690
o conteúdo de deslizar que pode
ser qualquer tipo de conteúdo.

00:32:58.690 --> 00:33:02.455
Estamos aqui onde vemos
layout básico com um nível,

00:33:02.455 --> 00:33:05.290
e, em seguida, o SwipeItem é

00:33:05.290 --> 00:33:08.755
um elemento básico que
nos permite definir um texto,

00:33:08.755 --> 00:33:10.705
um ícone, uma cor de fundo,

00:33:10.705 --> 00:33:15.865
e, claro, ter comandos
e métodos a serem invocados.

00:33:15.865 --> 00:33:20.785
Como você pode ver no GIF que
veremos mais tarde com uma demonstração,

00:33:20.785 --> 00:33:23.740
você pode deslizar em qualquer direção.

00:33:23.740 --> 00:33:27.535
Nós também temos o
ComportamentoInvocado que é usado,

00:33:27.535 --> 00:33:30.970
o comportamento que vai
ter o SwipeView quando

00:33:30.970 --> 00:33:34.825
pressionamos ou tocamos em
qualquer um dos comandos.

00:33:34.825 --> 00:33:37.255
Temos auto por padrão,

00:33:37.255 --> 00:33:40.855
isso significa que o SwipeView
por padrão será fechado.

00:33:40.855 --> 00:33:44.545
Claro, podemos definir isso
explicitamente com a opção Fechar,

00:33:44.545 --> 00:33:47.245
mas há outro
opção que é RemainOpen,

00:33:47.245 --> 00:33:50.260
e com essa opção
significa que se torramos

00:33:50.260 --> 00:33:54.400
um dos comandos do
O SwipeView permanecerá aberto.

00:33:54.400 --> 00:33:59.290
Para executar e invocar qualquer ação
é fácil usar comandos,

00:33:59.290 --> 00:34:02.770
ou, neste caso, o método invocado,

00:34:02.770 --> 00:34:05.260
e usá-lo em Collection é

00:34:05.260 --> 00:34:09.025
muito semelhante ao
uso do RefreshView.

00:34:09.025 --> 00:34:10.870
Estamos usando site, por exemplo,

00:34:10.870 --> 00:34:16.780
o DataTemplate do ItemTemplate
de uma CollectionView para usar e

00:34:16.780 --> 00:34:20.845
permitir ter opções contextuais

00:34:20.845 --> 00:34:24.295
em cada item da coleção.

00:34:24.295 --> 00:34:29.170
Última coisa que vimos
SwipeItem antes são

00:34:29.170 --> 00:34:31.644
itens muito básicos permitem

00:34:31.644 --> 00:34:34.480
para personalizar um pouco
a cor de fundo,

00:34:34.480 --> 00:34:35.950
você pode definir o ícone,

00:34:35.950 --> 00:34:37.000
você pode definir o texto,

00:34:37.000 --> 00:34:42.655
mas e se você quiser um costume
conteúdo dentro de qualquer um dos itens?

00:34:42.655 --> 00:34:45.280
Bem, nós introduzimos também
outro SwipeItem,

00:34:45.280 --> 00:34:49.975
Eu acho [inaudível] SwipeItemView
que permitem qualquer tipo de visão,

00:34:49.975 --> 00:34:52.285
então permita que qualquer tipo de
conteúdo aqui dentro.

00:34:52.285 --> 00:34:58.525
Assim, você pode criar um conteúdo personalizado
dentro de qualquer um dos itens de deslizamento.

00:34:58.525 --> 00:35:03.200
Vamos ver uma demonstração
revendo todas essas coisas.

00:35:03.840 --> 00:35:07.060
Deixe-me mover novamente para o emulador,

00:35:07.060 --> 00:35:10.100
Vamos ver se continuam trabalhando.

00:35:13.830 --> 00:35:19.720
Então, bem, você pode deslizar
em qualquer direção,

00:35:19.720 --> 00:35:24.950
você pode usá-lo também em coleções,

00:35:25.740 --> 00:35:31.435
Bem, deixe-me mover rapidamente
para Custom SwipeView.

00:35:31.435 --> 00:35:34.420
Isso parece ser uma visão de conteúdo,

00:35:34.420 --> 00:35:38.035
mas se você deslizar para
qualquer uma das direções,

00:35:38.035 --> 00:35:41.800
você pode acessar mais layouts,

00:35:41.800 --> 00:35:44.515
e no final são SwipeItems.

00:35:44.515 --> 00:35:48.295
Gerald e eu temos alguns muito

00:35:48.295 --> 00:35:52.675
demos agradável e bonito
preparado usando todas essas coisas.

00:35:52.675 --> 00:35:55.869
Temos tempo [inaudível]
para rever tudo,

00:35:55.869 --> 00:35:59.800
mas deixe-me mover muito rapidamente
para todas essas demonstrações,

00:35:59.800 --> 00:36:01.390
por exemplo, neste,

00:36:01.390 --> 00:36:03.610
Gerald, se quiser conversar.
muito rapidamente sobre isso.

00:36:03.610 --> 00:36:07.030
>> sim. Então esse aqui
combina todas as coisas.

00:36:07.030 --> 00:36:08.650
Então, no topo lá você vê

00:36:08.650 --> 00:36:12.280
um CarrosselVer com um
IndicadorVer em cima dele,

00:36:12.280 --> 00:36:15.370
e outro CarrosselVer
bem ali.

00:36:15.370 --> 00:36:16.780
Então você pode ver que você pode criar

00:36:16.780 --> 00:36:19.330
belos desenhos com
tudo isso junto.

00:36:19.330 --> 00:36:23.065
Na parte inferior lá você vai
provavelmente ver um CollectionView.

00:36:23.065 --> 00:36:25.135
Então, sim, quero dizer,

00:36:25.135 --> 00:36:30.265
não deixe o design funcional de
nosso aplicativo de demonstração tirá-lo dos trilhos.

00:36:30.265 --> 00:36:34.495
Você certamente pode criar muito
coisas incríveis com isso.

00:36:34.495 --> 00:36:36.460
Então Javier, você quer
para mostrar rapidamente

00:36:36.460 --> 00:36:43.240
seu RefreshView Personalizado
Teatro de animação?

00:36:43.240 --> 00:36:45.010
>> Vamos mostrá-lo muito rapidamente,

00:36:45.010 --> 00:36:48.820
para que possamos personalizar o
cores do RefreshView,

00:36:48.820 --> 00:36:50.020
mas neste caso, por exemplo,

00:36:50.020 --> 00:36:51.610
o que acontece se você quiser criar

00:36:51.610 --> 00:36:54.610
um efeito pull-to-refresh personalizado?

00:36:54.610 --> 00:36:57.370
Bem, você pode fazer isso muito simples.

00:36:57.370 --> 00:37:02.559
Mais uma vez, o que estou fazendo aqui
está apenas usando o SwipeView,

00:37:02.559 --> 00:37:04.420
Estou usando o item superior para usar

00:37:04.420 --> 00:37:06.640
uma animação lottie muito bonita

00:37:06.640 --> 00:37:10.465
que eu só fiz baseado
no tempo de execução.

00:37:10.465 --> 00:37:13.420
Então você pode misturar todo esse tipo de

00:37:13.420 --> 00:37:16.540
controles e outras coisas para criar muito,

00:37:16.540 --> 00:37:19.130
UIs muito bonito.

00:37:21.690 --> 00:37:26.110
Temos mais demonstrações,
mas não muito tempo.

00:37:26.110 --> 00:37:28.825
Então chegamos ao fim.

00:37:28.825 --> 00:37:33.130
Deixe-me compartilhar muito rapidamente onde
você pode encontrar todas essas demonstrações,

00:37:33.130 --> 00:37:37.420
e há um monte de mais
demonstrações e outras coisas que temos

00:37:37.420 --> 00:37:41.380
não mostrado porque temos menos tempo,

00:37:41.380 --> 00:37:46.090
que todas essas demonstrações
precisa passar um por um.

00:37:46.090 --> 00:37:48.850
Mas você pode encontrar tudo
nesses dois links.

00:37:48.850 --> 00:37:51.190
Espero que seja útil para você,

00:37:51.190 --> 00:37:55.009
e eu não sei se
temos perguntas.

00:37:55.890 --> 00:37:59.170
>> Sim, temos apenas
uma pergunta rápida

00:37:59.170 --> 00:38:01.885
antes de entregar
para os próximos alto-falantes,

00:38:01.885 --> 00:38:05.770
e isto é, é a visão de coleção

00:38:05.770 --> 00:38:10.460
ter o carregamento preguiçoso e
recurso de dados infinitos?

00:38:11.910 --> 00:38:15.700
>> Eu acho, quero dizer,

00:38:15.700 --> 00:38:18.370
você é capaz de
implementá-lo você mesmo.

00:38:18.370 --> 00:38:21.400
Nós provavelmente poderíamos fazer
mais nessa área

00:38:21.400 --> 00:38:24.670
para apoiá-lo fora da caixa.

00:38:24.670 --> 00:38:26.800
Mas agora, você pode fazê-lo com

00:38:26.800 --> 00:38:30.535
o SwipeEvents você pode
ver qual item é mostrado,

00:38:30.535 --> 00:38:33.610
e assim você pode começar
carregando novos dados.

00:38:33.610 --> 00:38:36.385
Então, sim, isso é definitivamente possível.

00:38:36.385 --> 00:38:37.180
>> Perfeito.

00:38:37.180 --> 00:38:38.890
>> Então, por padrão o
CollectionView tem

00:38:38.890 --> 00:38:41.575
alguns comandos para detectar
quando você chega ao fim,

00:38:41.575 --> 00:38:43.810
e muito mais dados,
e todas essas coisas.

00:38:43.810 --> 00:38:46.300
Então todo esse tipo de
coisas é possível.

00:38:46.300 --> 00:38:47.845
>> Muito mais fácil do que com ListView.

00:38:47.845 --> 00:38:48.655
>> sim.

00:38:48.655 --> 00:38:51.850
>> Parece ótimo. Está bem.
Muito obrigado por sua palestra,

00:38:51.850 --> 00:38:54.805
e agora, eu disto-o ao James.

00:38:54.805 --> 00:38:56.965
>> Incrível. Muito obrigado

00:38:56.965 --> 00:38:59.605
Olia, Gerald e Javier.

00:38:59.605 --> 00:39:02.560
Super incrível. Eu amo todos os
características incríveis que estão acontecendo.

00:39:02.560 --> 00:39:05.200
Agora, eu estou realmente animado
porque vivem da Itália,

00:39:05.200 --> 00:39:07.870
Codrina está aqui para conversar.
para nós sobre como podemos

00:39:07.870 --> 00:39:10.630
realmente testar o nosso
Aplicações de Xamarin,

00:39:10.630 --> 00:39:12.700
nossa ui, e nosso código fonte.

00:39:12.700 --> 00:39:16.625
Codrina, vou estourar.
mais para você e levá-lo embora.

00:39:16.625 --> 00:39:19.560
>> Obrigado, James. Olá a todos,

00:39:19.560 --> 00:39:24.105
e eu vou compartilhar minha tela,

00:39:24.105 --> 00:39:28.570
e eu estarei pronto para começar.