WEBVTT

00:00:00.000 --> 00:00:02.715
>> Hola a todos. Soy Olia.

00:00:02.715 --> 00:00:05.310
Soy gerente de on.NET equipo.

00:00:05.310 --> 00:00:08.355
Súper emocionado de ser un
parte de este evento.

00:00:08.355 --> 00:00:10.980
Estaré con ustedes todo el día hoy.

00:00:10.980 --> 00:00:14.610
la introducción de oradores y
haciendo preguntas con James.

00:00:14.610 --> 00:00:18.930
Acabamos de escuchar una increíble
nota clave, muy inspirador.

00:00:18.930 --> 00:00:21.585
Ahora, estoy súper emocionado de presentar

00:00:21.585 --> 00:00:24.720
nuestros próximos oradores, Javier y Gerald.

00:00:24.720 --> 00:00:29.230
Hablarán sobre
visualizando sus datos.

00:00:29.390 --> 00:00:32.340
>> Hola. Sí, aquí estamos.

00:00:32.340 --> 00:00:33.790
>> Hola.

00:00:34.070 --> 00:00:37.640
>> Muchas gracias. Así que vamos a

00:00:37.640 --> 00:00:40.580
me acaba de entrar directamente
y compartir mi pantalla.

00:00:40.580 --> 00:00:44.330
Aquí vamos, y conseguir
esta sesión comenzó.

00:00:44.330 --> 00:00:47.105
Así que sí, como ya se ha mencionado,

00:00:47.105 --> 00:00:50.060
vamos a hablar de
hoy visualizando sus datos,

00:00:50.060 --> 00:00:51.965
así que vamos a hablar
acerca de CollectionView,

00:00:51.965 --> 00:00:54.725
CarouselView, una pareja
de otras cosas más.

00:00:54.725 --> 00:00:57.110
Creo que David y Maddy

00:00:57.110 --> 00:01:00.290
ya compartió algunos de los
bondad que vamos a mostrar.

00:01:00.290 --> 00:01:02.720
Pero haremos todo lo posible para
darle un poco más

00:01:02.720 --> 00:01:05.375
de una inmersión profunda y mostrarle lo que

00:01:05.375 --> 00:01:08.000
es realmente posible con
todos estos controles impresionantes

00:01:08.000 --> 00:01:11.195
que están en Xamarin
Formularios disponibles hoy.

00:01:11.195 --> 00:01:13.055
Así que estemos nosotros,

00:01:13.055 --> 00:01:17.080
entonces al menos sabrás
a quien vas a escuchar.

00:01:17.080 --> 00:01:22.085
Mi nombre es Gerald Versluis
de los Países Bajos,

00:01:22.085 --> 00:01:23.840
y mi buen amigo Javier,

00:01:23.840 --> 00:01:28.280
ambos somos parte de Xamarin
Equipo de Formularios, Ingenieros de Software.

00:01:28.280 --> 00:01:31.070
Así que sí, estamos creando
algunas de las cosas

00:01:31.070 --> 00:01:34.490
que usted, con suerte, disfrutar de usar.

00:01:34.490 --> 00:01:37.280
Hoy vamos a hablar
acerca de estas cosas básicamente.

00:01:37.280 --> 00:01:39.245
Tenemos mucho que cubrir.

00:01:39.245 --> 00:01:42.620
Así que vamos a tener mucho
de diferentes demostraciones combinando

00:01:42.620 --> 00:01:46.495
todos estos controles impresionantes y
Funciones. Así que trata de seguir el día.

00:01:46.495 --> 00:01:47.690
Si tiene alguna pregunta,

00:01:47.690 --> 00:01:49.340
por favor, póngase en contacto con cualquiera de nosotros,

00:01:49.340 --> 00:01:51.470
estamos encantados de responder a cualquier pregunta.

00:01:51.470 --> 00:01:53.810
Javier y yo cambiaremos
un par de veces.

00:01:53.810 --> 00:01:55.430
Así que si ves tu pantalla

00:01:55.430 --> 00:01:57.470
parpadeo o cualquier cosa
otra cosa divertida pasando,

00:01:57.470 --> 00:01:58.940
no te preocupes, somos todos nosotros,

00:01:58.940 --> 00:02:01.775
no eres tú. Empecemos.

00:02:01.775 --> 00:02:04.475
Voy a hablar un poco
sobre CollectionView primero,

00:02:04.475 --> 00:02:07.025
y Javier se hará cargo.

00:02:07.025 --> 00:02:10.250
Sí, como dije, vamos a
cambiar un par de veces.

00:02:10.250 --> 00:02:13.055
Así que cada vez que escuchas un
hermoso acento español,

00:02:13.055 --> 00:02:15.180
entonces Javier se hizo cargo.

00:02:16.660 --> 00:02:19.265
Comencemos con CollectionView.

00:02:19.265 --> 00:02:20.960
CollectionView es básicamente

00:02:20.960 --> 00:02:23.285
el sucesor espiritual
de listView.

00:02:23.285 --> 00:02:29.155
El ListView que todos conocemos o que
saber y amar, todos lo hemos utilizado.

00:02:29.155 --> 00:02:31.970
Pero sí, puedes amar
puedes odiarlo.

00:02:31.970 --> 00:02:35.105
El hecho es que necesitábamos en
básicamente todas nuestras aplicaciones.

00:02:35.105 --> 00:02:36.830
Necesitamos mostrar datos en nuestras aplicaciones,

00:02:36.830 --> 00:02:38.960
eso es básicamente el fundamento de

00:02:38.960 --> 00:02:42.290
todas las aplicaciones que está utilizando.

00:02:42.290 --> 00:02:45.230
Pero sí, ha habido
ha sido algunas cosas con

00:02:45.230 --> 00:02:47.990
ListView que se podría mejorar.

00:02:47.990 --> 00:02:50.615
Así que es por eso que subimos
con la última vista.

00:02:50.615 --> 00:02:52.940
Hemos tomado todos los aprendizajes de

00:02:52.940 --> 00:02:56.390
el ListView y ponerlo
en este nuevo control,

00:02:56.390 --> 00:03:01.730
y se puede utilizar esto para mostrar
todos los datos en diferentes diseños.

00:03:01.730 --> 00:03:03.320
Tienes más flexibilidad,

00:03:03.320 --> 00:03:06.545
y sobre todo es más
actuando que nunca.

00:03:06.545 --> 00:03:11.045
Para que puedas ver hacia abajo
aquí una pequeña muestra,

00:03:11.045 --> 00:03:13.500
donde se puede definir
el CollectionView.

00:03:13.500 --> 00:03:15.680
Todo esto funciona, por supuesto, en XAML y

00:03:15.680 --> 00:03:19.580
codificar al igual que usted es
utilizado a xamarin Forms.

00:03:19.580 --> 00:03:23.150
Puede especificar el origen del artículo
al igual que en el ListView.

00:03:23.150 --> 00:03:26.480
Pero ahora, también puedes
especificar el diseño de elementos.

00:03:26.480 --> 00:03:27.500
Así que usted puede especificar,

00:03:27.500 --> 00:03:29.900
¿lo quieres vertical
u horizontal,

00:03:29.900 --> 00:03:33.710
y también se puede decir ¿verdad
tal vez quiera tenerlo en una cuadrícula.

00:03:33.710 --> 00:03:35.990
Así que sí, ya hay

00:03:35.990 --> 00:03:39.020
cierta flexibilidad que se puede
ver sucediendo aquí.

00:03:39.020 --> 00:03:41.180
Estas son todas las cosas que puedes

00:03:41.180 --> 00:03:44.060
uso hoy fuera de la caja
con CollectionView.

00:03:44.060 --> 00:03:45.470
Así que si tenemos enlaces de datos,

00:03:45.470 --> 00:03:47.480
entonces puedes usar plantillas de datos,

00:03:47.480 --> 00:03:49.670
plantillas, por supuesto.

00:03:49.670 --> 00:03:51.275
Puede utilizar los diferentes diseños.

00:03:51.275 --> 00:03:55.175
A la derecha aquí, se puede ver
el diseño de cuadrícula, por ejemplo.

00:03:55.175 --> 00:03:57.170
Puede utilizar la selección de posiciones,

00:03:57.170 --> 00:03:59.630
por lo que puede hacer clic en un elemento en

00:03:59.630 --> 00:04:03.840
CollectionView y
hacer su magia en eso.

00:04:03.840 --> 00:04:06.290
Puede profundizar en un
vista detallada desde allí.

00:04:06.290 --> 00:04:07.715
Tenemos la vista vacía.

00:04:07.715 --> 00:04:09.875
Así que cada vez que se puede mezclar esto con

00:04:09.875 --> 00:04:13.370
una barra de búsqueda y no hay
resultados de su acción de búsqueda,

00:04:13.370 --> 00:04:16.400
se puede aparecer este vacío
vista sin sudor.

00:04:16.400 --> 00:04:20.840
No es necesario intercambiar ninguna
vistas en su propio árbol visual.

00:04:20.840 --> 00:04:23.510
Puedes hacerlo directamente
desde CollectionView.

00:04:23.510 --> 00:04:25.715
También hemos mejorado el desplazamiento.

00:04:25.715 --> 00:04:28.430
Así que ahora tienes un evento
con mucha información.

00:04:28.430 --> 00:04:30.920
Puede determinar la rapidez con la que
alguien se está desplazando,

00:04:30.920 --> 00:04:32.390
de qué manera se están desplazando,

00:04:32.390 --> 00:04:34.865
y también tendremos
para desplazarse al método.

00:04:34.865 --> 00:04:36.770
Así que usted puede desplazarse fácilmente a

00:04:36.770 --> 00:04:38.900
un cierto punto en
su CollectionView.

00:04:38.900 --> 00:04:42.530
Esto es sólo unas pocas cosas
que hemos implementado en

00:04:42.530 --> 00:04:46.730
este nuevo control increíble que
es Xamarin Forms en este momento.

00:04:46.730 --> 00:04:51.695
Así que vamos a saltar rápidamente en
Visual Studio y mostrar algunas demostraciones.

00:04:51.695 --> 00:04:55.450
Con suerte, ahí vamos.

00:04:55.450 --> 00:04:57.530
Así que aquí tenemos Visual
Estudio para Mac.

00:04:57.530 --> 00:04:59.750
Si no lo has visto antes,

00:04:59.750 --> 00:05:03.155
sólo se puede utilizar Visual
Estudio en un Mac ahora mismo.

00:05:03.155 --> 00:05:06.140
Vamos primero a ir
en alguna demostración visual.

00:05:06.140 --> 00:05:09.505
Así que tengo el iOS
emulador abierto aquí.

00:05:09.505 --> 00:05:12.575
Javier y yo hemos creado
una pequeña aplicación de ejemplo.

00:05:12.575 --> 00:05:17.330
Ahora, ten en cuenta, estas demostraciones son
tomado de nuestra aplicación de la galería,

00:05:17.330 --> 00:05:19.430
que es parte de la
Repositorio de Xamarin Forms,

00:05:19.430 --> 00:05:21.350
donde realizamos todas nuestras pruebas.

00:05:21.350 --> 00:05:25.160
Así que no necesariamente
ser una hermosa aplicación,

00:05:25.160 --> 00:05:27.350
pero es funcional, y tenemos

00:05:27.350 --> 00:05:30.290
algunos más hermosos
muestras para mostrarle.

00:05:30.290 --> 00:05:33.620
Puedes darle estilo de cualquier manera que
al final de esta sesión.

00:05:33.620 --> 00:05:37.160
Así que no se confunda si
no se ve totalmente increíble,

00:05:37.160 --> 00:05:39.920
pero concéntrese en lo que es
funcionalmente sucediendo aquí.

00:05:39.920 --> 00:05:42.320
Así que básicamente tomamos la agenda,

00:05:42.320 --> 00:05:43.490
y aquí están todas las cosas diferentes,

00:05:43.490 --> 00:05:44.630
tenemos el CollectionView,

00:05:44.630 --> 00:05:48.185
el CarouselView, IndicatorView
y todas las cosas.

00:05:48.185 --> 00:05:51.445
Pero vamos con el
CollectionView ahora mismo.

00:05:51.445 --> 00:05:55.845
Como mencioné,
usted puede simplemente ir con

00:05:55.845 --> 00:05:59.600
una colección de cuerdas
tenemos aquí.

00:05:59.600 --> 00:06:01.310
Esto es.

00:06:01.310 --> 00:06:03.110
Esto es sólo una colección de cadenas.

00:06:03.110 --> 00:06:05.840
Usted conecta eso a la
fuente del artículo y auge,

00:06:05.840 --> 00:06:08.505
tiene un CollectionView
con cuerdas.

00:06:08.505 --> 00:06:10.490
Como pueden ver, esto también es

00:06:10.490 --> 00:06:13.130
con la selección
capacidades habilitadas.

00:06:13.130 --> 00:06:15.560
Así que puedes seleccionar elementos aquí,

00:06:15.560 --> 00:06:17.630
y en base al evento o

00:06:17.630 --> 00:06:19.865
el comando que se conecta a esto,

00:06:19.865 --> 00:06:23.160
se podría ir a la
siguiente pantalla desde aquí.

00:06:23.360 --> 00:06:26.990
Como pueden ver, hay
un montón de cosas aquí,

00:06:26.990 --> 00:06:30.005
por lo que probablemente desea
echa un vistazo a esto por ti mismo.

00:06:30.005 --> 00:06:32.944
Todas las funcionalidades son

00:06:32.944 --> 00:06:35.630
lista y se puede
tener una jugada con esto.

00:06:35.630 --> 00:06:38.990
Así que la mayoría de estas cosas
también tienen diferentes varianzas en

00:06:38.990 --> 00:06:42.800
código en tal vez XAML y
horizontal, vertical.

00:06:42.800 --> 00:06:45.845
Como dije, esto también es
utilizado para ejecutar nuestras pruebas en.

00:06:45.845 --> 00:06:47.660
Así que hay un montón de cosas aquí.

00:06:47.660 --> 00:06:49.220
La otra cosa que
Quiero mostrarte

00:06:49.220 --> 00:06:51.590
aquí que esto combina un
par de las cosas que

00:06:51.590 --> 00:06:55.265
Hablé antes es el
selector de plantilla de datos.

00:06:55.265 --> 00:06:59.765
Así que esta plantilla selecciona
siempre que sea un día de la semana.

00:06:59.765 --> 00:07:02.780
Utiliza una plantilla para
una ventaja por alguna razón.

00:07:02.780 --> 00:07:07.400
Siempre que es fin de semana,
ver este otro icono aquí.

00:07:07.400 --> 00:07:10.490
Así que esto se repite
por un par de veces.

00:07:10.490 --> 00:07:12.140
Pero puedes filtrar esto fácilmente.

00:07:12.140 --> 00:07:14.660
Así que si sólo voy por el lunes,

00:07:14.660 --> 00:07:16.580
descubrimiento no está realmente optimizado,

00:07:16.580 --> 00:07:17.970
así que esto toma un poco,

00:07:17.970 --> 00:07:19.670
y debería presionar "Enter",

00:07:19.670 --> 00:07:21.320
verás todos los lunes.

00:07:21.320 --> 00:07:24.200
Si buscamos algo
que no está aquí,

00:07:24.200 --> 00:07:26.870
por lo que un día de lunes, se puede ver que esto es

00:07:26.870 --> 00:07:29.720
la vista vacía porque no
tener resultados de búsqueda aquí.

00:07:29.720 --> 00:07:31.715
Así que aparecerá la vista vacía,

00:07:31.715 --> 00:07:35.180
y esto es justo lo que
saldrás de la caja

00:07:35.180 --> 00:07:40.210
cada vez que su colección no
tienen algún artículo allí.

00:07:40.210 --> 00:07:43.170
Entonces, ¿qué tenemos más?
Por supuesto, todo esto

00:07:43.170 --> 00:07:45.844
trabaja con colecciones observables.

00:07:45.844 --> 00:07:48.800
Así que usted puede tomar sólo
esto y se puede ver

00:07:48.800 --> 00:07:52.490
aquí tenemos un par de
controles aquí en la parte superior.

00:07:52.490 --> 00:07:54.380
También tenemos encabezados y pies de página.

00:07:54.380 --> 00:07:57.410
Creo que Javier mostrará
te pasa un poco por eso.

00:07:57.410 --> 00:07:59.630
Pero aquí tenemos artículos,

00:07:59.630 --> 00:08:02.210
y porque es un
colección observable,

00:08:02.210 --> 00:08:05.300
se puede observar cualquier cambio que
sucederá en esta colección.

00:08:05.300 --> 00:08:07.580
Así que podemos eliminar un par de aquí,

00:08:07.580 --> 00:08:10.700
y ves que
se actualiza automáticamente.

00:08:10.700 --> 00:08:13.970
Siempre que queremos insertar
un par de cosas,

00:08:13.970 --> 00:08:16.550
estará aquí insertado en la parte superior.

00:08:16.550 --> 00:08:19.070
También puedo especificar un
diferente índice para

00:08:19.070 --> 00:08:22.160
insertarlo en un diferente
posición si quiero.

00:08:22.160 --> 00:08:26.705
Así que sí, y también puedo mover un
un par de estas cosas alrededor.

00:08:26.705 --> 00:08:32.085
Así que ves que esto funciona al instante.

00:08:32.085 --> 00:08:33.780
Muy performante, se ve bien,

00:08:33.780 --> 00:08:37.870
tiene esta animación de desvanecimiento.
Se ve increíble.

00:08:38.820 --> 00:08:41.650
Entonces, ¿qué tenemos más?
Tenemos puntos rápidos.

00:08:41.650 --> 00:08:43.510
Eso también es algo
hemos presentado.

00:08:43.510 --> 00:08:45.310
Así que si nunca lo has visto antes,

00:08:45.310 --> 00:08:47.930
vamos a tomar una lista vertical esta vez.

00:08:48.030 --> 00:08:51.310
Los puntos de ajuste básicamente significan
que cada vez que te desplazas,

00:08:51.310 --> 00:08:52.690
Quiero decir, ahora, no hace nada.

00:08:52.690 --> 00:08:53.800
Pero cada vez que seleccionamos

00:08:53.800 --> 00:08:57.670
un punto de presión aquí y
lo establecemos en obligatorio,

00:08:57.670 --> 00:09:00.520
entonces ves cada vez que me desplazo
aquí y lo puse en algo,

00:09:00.520 --> 00:09:04.150
se rompe para obtener un
cierto artículo y se puede

00:09:04.150 --> 00:09:08.275
influir en ese comportamiento estableciendo
aquí el inicio o el centro.

00:09:08.275 --> 00:09:10.240
Así que cada vez que lo puse en el centro,

00:09:10.240 --> 00:09:11.755
centrará un artículo.

00:09:11.755 --> 00:09:14.740
Así que ahora mismo, ven dos elementos aquí,

00:09:14.740 --> 00:09:16.015
pero ahora empiezo a desplazarme,

00:09:16.015 --> 00:09:19.600
y siempre que no tengo
un artículo en el centro aquí,

00:09:19.600 --> 00:09:24.430
se asegurará de que se rompa
a un elemento central aquí.

00:09:24.430 --> 00:09:26.530
Así que esto se verá
hermoso en sus diseños,

00:09:26.530 --> 00:09:28.390
y puedes hacerlo
trabajar como quieras.

00:09:28.390 --> 00:09:30.940
Puede configurar un par

00:09:30.940 --> 00:09:33.730
de las cosas aquí para que sea
trabajar con su diseño.

00:09:33.730 --> 00:09:35.500
Entonces, ¿qué tenemos más?

00:09:35.500 --> 00:09:37.915
También tenemos que desplazarnos
también, ya lo mencioné.

00:09:37.915 --> 00:09:40.480
Una vez más, múltiples opciones
aquí para elegir.

00:09:40.480 --> 00:09:43.060
Vamos a elegir uno
y podemos decir, "Bien,

00:09:43.060 --> 00:09:46.570
desplazarse al índice, por lo que tenemos un
número de artículos aquí de nuevo,"

00:09:46.570 --> 00:09:51.175
como mencioné, no necesariamente
muy bonito, pero funciona.

00:09:51.175 --> 00:09:54.235
Así que si digo scroll to
índice y digo 10,

00:09:54.235 --> 00:09:56.065
que no está a la vista aquí,

00:09:56.065 --> 00:09:57.385
y hago esto,

00:09:57.385 --> 00:09:59.845
entonces se asegurará de que
que se desplaza a 10.

00:09:59.845 --> 00:10:02.470
Porque defino el pergamino en
posición para hacer visible,

00:10:02.470 --> 00:10:03.670
simplemente lo hará visible.

00:10:03.670 --> 00:10:05.065
Así que será al final ahora.

00:10:05.065 --> 00:10:07.900
Pero también puedo configurar esto para
estar en el centro inicial o final.

00:10:07.900 --> 00:10:11.275
Así que si me puse esto para ser en el
empezar y vuelvo a pulsar "Go",

00:10:11.275 --> 00:10:14.900
se asegurará de que este
artículo se presenta al principio.

00:10:17.130 --> 00:10:19.450
¿Qué tengo más?

00:10:19.450 --> 00:10:22.090
[inaudible] , vamos
para ver que más tarde.

00:10:22.090 --> 00:10:23.620
Vista vacía, ya hemos visto que

00:10:23.620 --> 00:10:25.510
un poco y la selección también.

00:10:25.510 --> 00:10:28.015
Pero vamos a ser rápidos
sumergirse en este.

00:10:28.015 --> 00:10:29.980
Tenemos múltiples modos de selección.

00:10:29.980 --> 00:10:33.550
Así que usted puede tener uno o
múltiples selecciones aquí o ninguna,

00:10:33.550 --> 00:10:35.320
que también es una posibilidad.

00:10:35.320 --> 00:10:37.600
Así que ahora mismo, puedo seleccionar cualquier cosa.

00:10:37.600 --> 00:10:39.580
Pero cuando lo puse en single,

00:10:39.580 --> 00:10:41.320
a continuación, puede seleccionar una
de las opciones aquí.

00:10:41.320 --> 00:10:43.990
Se puede ver que también
trabaja en el diseño de la cuadrícula,

00:10:43.990 --> 00:10:49.240
y se puede ver aquí todos los
información que viene del evento.

00:10:49.240 --> 00:10:51.520
También podemos hacer múltiples.

00:10:51.520 --> 00:10:56.860
Así que en este momento, ves que
tienen una selección de múltiplos.

00:10:56.860 --> 00:10:59.230
Yo entraría en el código aquí,

00:10:59.230 --> 00:11:02.380
pero veo que estoy tomando
ya un tiempo,

00:11:02.380 --> 00:11:06.400
así que creo que voy a entregarlo
a Javier ahora mismo y Javier

00:11:06.400 --> 00:11:10.360
entonces puede mostrar un poco
de código y sumergirse en eso.

00:11:10.360 --> 00:11:12.475
Javier, llévatelo.

00:11:12.475 --> 00:11:16.630
>> Lo intentaré. Así que vamos a
continuar con más personal

00:11:16.630 --> 00:11:19.330
sobre la vista de la colección porque en

00:11:19.330 --> 00:11:22.405
hecho de que tenemos una locura
cantidad de muestras.

00:11:22.405 --> 00:11:28.900
Así que no sé exactamente dónde
dejas la muestra.

00:11:28.900 --> 00:11:31.390
Permítanme ejecutar, en este caso,

00:11:31.390 --> 00:11:35.720
usando android, cualquier cosa que
que usas con iOS. Así que vamos a ver.

00:11:39.360 --> 00:11:42.760
>> Hablaré mientras
te hace funcionar.

00:11:42.760 --> 00:11:44.980
Sabía que ibas a ir.
para mostrar Android.

00:11:44.980 --> 00:11:46.825
Quiero decir, todo es Xamarin Forms.

00:11:46.825 --> 00:11:49.165
Así que lo que sea que implementamos,

00:11:49.165 --> 00:11:52.600
puedes hacer esto en Android siempre que
el emulador funciona y

00:11:52.600 --> 00:11:56.365
puede hacerlo en iOS y lo hará
ambos muestran resultados similares.

00:11:56.365 --> 00:12:02.350
Así que sí, por eso
optó por hacerlo en iOS.

00:12:02.350 --> 00:12:07.000
>> Así que siento que tengo un
problema con el simulador.

00:12:07.000 --> 00:12:10.150
No sé por qué es
no funciona. ¿Nada?

00:12:10.150 --> 00:12:12.895
>> Muy bien. Quieres
me para continuar?

00:12:12.895 --> 00:12:16.120
>> Sí. Por favor, continúe
con la demostración.

00:12:16.120 --> 00:12:17.230
>> Muy bien.

00:12:17.230 --> 00:12:20.245
>> Cometí un error y me preparo

00:12:20.245 --> 00:12:21.925
todas las demostraciones,

00:12:21.925 --> 00:12:23.815
Como hace una hora,

00:12:23.815 --> 00:12:28.555
Siento que tal vez
no fue la mejor idea.

00:12:28.555 --> 00:12:33.955
>> De ninguna manera. Sólo llenaré el tiempo.

00:12:33.955 --> 00:12:35.305
Avísame cuando estés listo.

00:12:35.305 --> 00:12:38.845
Así que vamos a ver.

00:12:38.845 --> 00:12:40.420
Aquí vamos. Lo siento por el

00:12:40.420 --> 00:12:42.370
pantallas intermitentes y
todo, aquí vamos.

00:12:42.370 --> 00:12:44.530
Vamos a ver lo que sea
tenemos más aquí.

00:12:44.530 --> 00:12:49.555
Así que lo que se puede hacer más con
vista de colección, tenemos selección.

00:12:49.555 --> 00:12:51.220
También puede agrupar.

00:12:51.220 --> 00:12:54.250
Así que eso también es algo que
podría saberlo en la vista de lista.

00:12:54.250 --> 00:12:56.815
Así que aquí tenemos algunas agrupaciones

00:12:56.815 --> 00:13:00.550
y veo que tenemos algunos
superhéroes aquí.

00:13:00.550 --> 00:13:04.270
Esto tiene un encabezado y
un pie de página por grupo.

00:13:04.270 --> 00:13:08.215
Así que aquí tenemos a los Vengadores
con todos los miembros allí

00:13:08.215 --> 00:13:10.480
y los Cuatro Fantásticos
y los defensores

00:13:10.480 --> 00:13:13.135
y todo tipo de otros superhéroes.

00:13:13.135 --> 00:13:16.200
Se agrupan en su mayoría en grupo,

00:13:16.200 --> 00:13:19.350
como cabría esperar, que es
también algo que podrías hacer.

00:13:19.350 --> 00:13:20.835
Creo que estamos trabajando

00:13:20.835 --> 00:13:24.120
en realidad chasquido
este grupo se remate aquí,

00:13:24.120 --> 00:13:27.330
para que algo
que aún está por venir.

00:13:27.330 --> 00:13:28.860
Pero al menos tienes

00:13:28.860 --> 00:13:31.350
la posibilidad de hacer
estos grupos en este momento.

00:13:31.350 --> 00:13:34.005
También puede hacer esto
sin plantillas,

00:13:34.005 --> 00:13:37.990
así que entonces no se ve tan bien.

00:13:37.990 --> 00:13:40.150
Javier, lo tienes arriba.
y corriendo de nuevo porque

00:13:40.150 --> 00:13:42.310
Sólo estoy nadando aquí.

00:13:42.310 --> 00:13:45.080
Iré a Espaciado de artículos.

00:13:45.420 --> 00:13:48.250
Lo cual también es algo
que puedes hacer.

00:13:48.250 --> 00:13:51.820
Así que vamos a usarlo con un
rejilla, eso siempre es bueno.

00:13:51.820 --> 00:13:54.460
Aquí puede especificar

00:13:54.460 --> 00:13:57.610
cuánto espacio debe haber
entre los diferentes elementos.

00:13:57.610 --> 00:14:02.470
Así que si empiezo a jugar aquí
y digo 10 y actualizar el espaciado,

00:14:02.470 --> 00:14:04.750
se puede ver que entre las columnas,

00:14:04.750 --> 00:14:07.230
habrá 10 espaciados.

00:14:07.230 --> 00:14:13.260
También puedo hacer esto entre el
filas porque se trata de una vista de cuadrícula.

00:14:13.260 --> 00:14:16.775
Así que cada vez que hago eso,

00:14:16.775 --> 00:14:19.510
entonces usted también debe
ver el espaciado aquí.

00:14:19.510 --> 00:14:21.310
Así que eso es algo
que también le dará

00:14:21.310 --> 00:14:23.230
más control sobre cómo las cosas

00:14:23.230 --> 00:14:29.030
mirar y para que funcione
con su diseño mejor.

00:14:30.000 --> 00:14:33.520
Muy bien. ¿Lo tienes?

00:14:33.520 --> 00:14:34.600
>> Puedo continuar si quieres.

00:14:34.600 --> 00:14:36.680
>> Está bien. Sí.

00:14:42.270 --> 00:14:46.810
>> Permítanme intercambiar la pantalla.

00:14:46.810 --> 00:14:48.850
Usted habló, creo,

00:14:48.850 --> 00:14:52.585
espaciado y luego podemos continuar
hablando de todas las cosas,

00:14:52.585 --> 00:14:54.430
como el tamaño del artículo.

00:14:54.430 --> 00:14:57.370
Hay diferentes
opciones aquí, pero yo

00:14:57.370 --> 00:15:00.310
quieren hablar de la
elemento dentro de esta estrategia,

00:15:00.310 --> 00:15:04.120
subpropiedad, donde
puede utilizar diferentes valores.

00:15:04.120 --> 00:15:07.630
Hay un valor que
este es el primer elemento.

00:15:07.630 --> 00:15:11.290
Esto significa que calcularemos
el tamaño del primer elemento,

00:15:11.290 --> 00:15:15.310
y usaremos lo mismo
tamaño de todas las celdas.

00:15:15.310 --> 00:15:18.025
Pero, por supuesto, hay

00:15:18.025 --> 00:15:22.015
opciones para calcular el tamaño
de todos los tamaños diferentes,

00:15:22.015 --> 00:15:25.165
como se puede ver en
esta muestra específica,

00:15:25.165 --> 00:15:28.840
todas las ventas de diferentes tamaños.

00:15:28.840 --> 00:15:30.400
Entonces, ¿cuál es la diferencia?

00:15:30.400 --> 00:15:33.820
La diferencia en este
caso es sobre el rendimiento.

00:15:33.820 --> 00:15:36.985
Si todas sus células tienen un
cierto tamaño de distancia,

00:15:36.985 --> 00:15:41.080
sólo calcular, una sola vez
es algo interesante.

00:15:41.080 --> 00:15:43.930
Entonces, por supuesto,
han hablado antes.

00:15:43.930 --> 00:15:45.760
Tenemos la opción de establecer

00:15:45.760 --> 00:15:48.265
el encabezado y el pie de página
de la vista de colección.

00:15:48.265 --> 00:15:53.740
Podemos usar flujos simples
pero también podemos usar

00:15:53.740 --> 00:15:57.640
plantillas y podemos

00:15:57.640 --> 00:16:01.495
encadenar directamente la visibilidad
de la cabecera y,

00:16:01.495 --> 00:16:04.190
por supuesto, desde el pie de página.

00:16:05.790 --> 00:16:10.675
El último, y creo que
que esto es sólo demo,

00:16:10.675 --> 00:16:12.850
bueno, [inaudible]
se ven muy, muy bonitos,

00:16:12.850 --> 00:16:13.975
pero esto es increíble.

00:16:13.975 --> 00:16:17.545
Echa un vistazo a esto
rendimiento increíble.

00:16:17.545 --> 00:16:19.990
Quiero parar un poco en

00:16:19.990 --> 00:16:22.900
la muestra porque lo que
estamos viendo aquí es

00:16:22.900 --> 00:16:26.560
un CollectionView anidado y que

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

00:16:29.860 --> 00:16:33.220
estábamos viendo antes
era usuario CollectionView,

00:16:33.220 --> 00:16:36.955
donde cada artículo es
otro CollectionView.

00:16:36.955 --> 00:16:39.550
Así que estamos anidando todos estos
CollectionViews para crear

00:16:39.550 --> 00:16:44.260
este diseño donde
probablemente usted ha visto.

00:16:44.260 --> 00:16:47.500
Por ejemplo, los
aplicación, aplicación de streaming,

00:16:47.500 --> 00:16:49.720
y es muy simple de crear,

00:16:49.720 --> 00:16:53.425
y, sí, funciona muy bien.

00:16:53.425 --> 00:16:58.060
Creo que podemos continuar
enfoque en CollectionView,

00:16:58.060 --> 00:17:01.570
pero saltemos a otro control.

00:17:01.570 --> 00:17:06.775
En este caso, CarouselView es
otro control muy agradable.

00:17:06.775 --> 00:17:10.720
Uno de los puntos muy agradables que es

00:17:10.720 --> 00:17:14.515
compartir una gran cantidad de código
con CollectionView,

00:17:14.515 --> 00:17:17.530
y por defecto, obtenemos
mucha funcionalidad

00:17:17.530 --> 00:17:20.755
desde el CollectionView
trabajando en el CarouselView.

00:17:20.755 --> 00:17:24.730
Pero vamos a tener un poco de tiempo

00:17:24.730 --> 00:17:29.965
con Gerald hablando de la
CarouselView con más detalles.

00:17:29.965 --> 00:17:32.545
>> Bueno, ya lo contaste todo.

00:17:32.545 --> 00:17:36.430
Veamos. Vamos a saltar
en el CarouselView.

00:17:36.430 --> 00:17:37.960
Así que como Javier ya mencionó,

00:17:37.960 --> 00:17:41.050
se construye en la parte superior básicamente
de CollectionView.

00:17:41.050 --> 00:17:45.280
Así que el CarouselView es

00:17:45.280 --> 00:17:47.334
básicamente lo que probablemente

00:17:47.334 --> 00:17:50.530
saber de la web y
otras aplicaciones populares.

00:17:50.530 --> 00:17:53.815
Así que la mayoría de las veces que sólo
mostrar una lista horizontal que

00:17:53.815 --> 00:17:57.295
diapositivas azulejos o esas cosas.

00:17:57.295 --> 00:17:59.050
Así que piensa en Netflix, quiero decir,

00:17:59.050 --> 00:18:03.265
todos estamos trabajando desde casa ahora
así que todos conocemos Netflix por ahora.

00:18:03.265 --> 00:18:05.725
Tienes estas filas donde tienes

00:18:05.725 --> 00:18:07.510
todo este CarouselViews
donde se puede simplemente

00:18:07.510 --> 00:18:10.060
desplazarse a través de todos sus
series y películas,

00:18:10.060 --> 00:18:14.260
y cada azulejo es una serie o película.

00:18:14.260 --> 00:18:19.150
Así que eso es básicamente todo
CarouselViews justo allí.

00:18:19.150 --> 00:18:21.220
Eso es lo que
implementado aquí también.

00:18:21.220 --> 00:18:24.040
Se puede ver un poco
muestra aquí en la parte inferior.

00:18:24.040 --> 00:18:27.625
Así que es básicamente sólo
una visión especializada de

00:18:27.625 --> 00:18:32.680
el CollectionView que tiene
un caso de uso muy específico.

00:18:32.680 --> 00:18:34.780
Así que puedes usar eso para mostrar

00:18:34.780 --> 00:18:37.555
sus datos en un visual
manera muy atractiva.

00:18:37.555 --> 00:18:41.410
Es muy popular en
aplicaciones modernas de hoy en día.

00:18:41.410 --> 00:18:44.965
Es más adecuado para
datos de longitud limitada.

00:18:44.965 --> 00:18:47.230
No significa que el rendimiento sea

00:18:47.230 --> 00:18:49.810
algo que no
trabajar para este control,

00:18:49.810 --> 00:18:53.515
pero es más adecuado
para todavía un número limitado

00:18:53.515 --> 00:18:55.360
de artículos en su colección

00:18:55.360 --> 00:18:57.880
que desea que sus usuarios
para desplazarse a través de.

00:18:57.880 --> 00:19:01.810
Puedes usar muchas cosas que
también están en collectionView.

00:19:01.810 --> 00:19:03.520
Así que también puedes usar la orientación,

00:19:03.520 --> 00:19:05.620
también se puede utilizar
diseño si lo desea.

00:19:05.620 --> 00:19:08.575
Las plantillas de datos serán grandes
para este control también.

00:19:08.575 --> 00:19:10.600
Funciona perfectamente junto con

00:19:10.600 --> 00:19:13.795
IndicadorVer que vamos a
ver un poco más tarde.

00:19:13.795 --> 00:19:16.450
Este control está en versión preliminar en este momento.

00:19:16.450 --> 00:19:18.445
Así que si quieres usar esto hoy,

00:19:18.445 --> 00:19:22.990
puede, pero necesita habilitar
con la bandera experimental.

00:19:22.990 --> 00:19:26.110
Así que verás esto en un par de

00:19:26.110 --> 00:19:30.040
diapositivas más para otros controles
que también están en versión preliminar.

00:19:30.040 --> 00:19:33.520
Entonces sólo recuerda que
todavía estamos trabajando en ello.

00:19:33.520 --> 00:19:34.840
Algunas cosas pueden cambiar,

00:19:34.840 --> 00:19:37.960
pero sí, la mayoría de los
cosas sólo deberían funcionar.

00:19:37.960 --> 00:19:41.635
Así que vamos a ir rápidamente y hacer un
pequeña demostración de eso también.

00:19:41.635 --> 00:19:44.390
Esto debería funcionar.

00:19:45.480 --> 00:19:49.375
Una vez más, voy a entrar
a esta aplicación de demostración aquí.

00:19:49.375 --> 00:19:51.610
Aquí tenemos el CarouselView.

00:19:51.610 --> 00:19:52.750
Así que este gran botón,

00:19:52.750 --> 00:19:55.045
no se olvide de presionar eso porque

00:19:55.045 --> 00:19:58.255
que permite la
bandera experimental.

00:19:58.255 --> 00:19:59.770
Aquí tenemos un par de opciones.

00:19:59.770 --> 00:20:01.225
Así que podemos hacer esto en código,

00:20:01.225 --> 00:20:03.340
horizontal o vertical, y tenemos

00:20:03.340 --> 00:20:05.860
algunos chasquidos y también un vacío
ver ese tipo de cosas.

00:20:05.860 --> 00:20:09.280
Así que vamos a ver si podemos conseguir esto.

00:20:09.280 --> 00:20:12.070
Aquí se puede ver tan
tenemos cinco artículos.

00:20:12.070 --> 00:20:15.070
Puedo actualizar fácilmente este
a 50 y debería haber

00:20:15.070 --> 00:20:18.265
un montón de más artículos de carrusel aquí.

00:20:18.265 --> 00:20:20.740
Así que tenemos una pequeña barra de desplazamiento aquí.

00:20:20.740 --> 00:20:22.960
Así que pueden ver que tenemos
un montón de artículos y que

00:20:22.960 --> 00:20:25.180
puede ver un montón de cosas que van
aquí cuando me estoy desplazando.

00:20:25.180 --> 00:20:27.835
Así que esto desencadena el evento de desplazamiento

00:20:27.835 --> 00:20:30.025
para que puedas ver qué elemento es visible,

00:20:30.025 --> 00:20:31.270
el primero, el último,

00:20:31.270 --> 00:20:33.040
también el Delta y el offset.

00:20:33.040 --> 00:20:35.200
Así que eso es de lo que hablé antes.

00:20:35.200 --> 00:20:38.365
Una gran cantidad de datos que vienen en
de ese evento de desplazamiento.

00:20:38.365 --> 00:20:41.110
Además, aquí el espaciado
es sólo algo que

00:20:41.110 --> 00:20:43.615
puede utilizar para que obtendrá un
un poco más de espacio,

00:20:43.615 --> 00:20:45.310
10 no es mucho,

00:20:45.310 --> 00:20:46.690
100 es un poco mucho,

00:20:46.690 --> 00:20:51.235
pero tienes la idea de que
puedes jugar con eso.

00:20:51.235 --> 00:20:57.085
Además, tienes algo que
llamar a PeekAreaInsets, creo.

00:20:57.085 --> 00:21:00.640
Así que pueden ver este pequeño
artículos aquí a la izquierda y

00:21:00.640 --> 00:21:02.215
el derecho y se puede

00:21:02.215 --> 00:21:04.660
determinar cuánto de
ese artículo que verás.

00:21:04.660 --> 00:21:08.575
Así que se ve un poco divertido cada vez que
cambias esto mientras corres,

00:21:08.575 --> 00:21:11.440
pero se puede ver que
puede burlarse un poco

00:21:11.440 --> 00:21:14.740
del artículo que es
anteriormente o después.

00:21:14.740 --> 00:21:16.540
También puedes ver que se está arrastrando.

00:21:16.540 --> 00:21:20.680
Así que eso es sobre todo para ver si el
usuario está arrastrando sí o no,

00:21:20.680 --> 00:21:23.890
y tenemos algunas otras propiedades
como podemos animar esto?

00:21:23.890 --> 00:21:25.210
¿Podemos deslizar esto?

00:21:25.210 --> 00:21:27.549
El rebote. Así que básicamente,

00:21:27.549 --> 00:21:29.890
cada vez que llegues al principio
o el final de la lista,

00:21:29.890 --> 00:21:33.950
¿rebota así o
¿se queda quieto?

00:21:34.710 --> 00:21:37.075
Por supuesto, también aquí,

00:21:37.075 --> 00:21:39.445
la cosa de ir a para que pueda ir a

00:21:39.445 --> 00:21:44.240
un cierto elemento en este CarouselView.

00:21:46.080 --> 00:21:49.270
Así que también aquí, veo que tengo una pestaña

00:21:49.270 --> 00:21:51.850
abierto para el chasquido. Sí, ¿lo siento?

00:21:51.850 --> 00:21:54.490
>> Bajo pergaminos, si

00:21:54.490 --> 00:21:57.715
volver muy rápidamente a
la lista de muestras,

00:21:57.715 --> 00:22:00.475
que centra la
carouselView vertical,

00:22:00.475 --> 00:22:05.590
para notar que es más común
tener CarouselView horizontal.

00:22:05.590 --> 00:22:09.715
Pero, por supuesto, puede crear
verticales sin problemas.

00:22:09.715 --> 00:22:13.750
>> Sí, no hay problema.
Aunque, aquí

00:22:13.750 --> 00:22:15.700
tienen el mecanismo de chasquido por lo que

00:22:15.700 --> 00:22:18.355
esto no tiene
cualquier chasquido en absoluto.

00:22:18.355 --> 00:22:20.260
Lo siento, tiene chasquido.

00:22:20.260 --> 00:22:23.020
Así que debería frenar esto
abajo y lo verás.

00:22:23.020 --> 00:22:26.020
Así que cada vez que no aterrizo
en un elemento específico,

00:22:26.020 --> 00:22:30.070
se asegurará de que se
ir al principio aquí.

00:22:30.070 --> 00:22:33.550
Pero creo que tuve un poco
código abierto para esto aquí.

00:22:33.550 --> 00:22:35.530
Así que para todas estas cosas

00:22:35.530 --> 00:22:37.660
hemos hecho que sea tan fácil como
posible para su uso.

00:22:37.660 --> 00:22:39.280
Así que aquí, sólo se puede decir,

00:22:39.280 --> 00:22:41.095
hacer un nuevo CarouselView.

00:22:41.095 --> 00:22:43.270
Puede especificar qué diseño utilizar.

00:22:43.270 --> 00:22:45.520
Tenemos algunos predefinidos para ti.

00:22:45.520 --> 00:22:49.690
Es posible que pueda crear
sus propios diseños en este momento.

00:22:49.690 --> 00:22:54.020
Javier, ¿sabes? O tal vez
lo permitirá en el futuro.

00:22:54.210 --> 00:22:56.890
Puede usar itemTemplates,

00:22:56.890 --> 00:22:59.230
el color de fondo
o el PeekAreaInsets,

00:22:59.230 --> 00:23:02.510
Ya lo mencioné.

00:23:02.790 --> 00:23:07.000
Esto es básicamente todo lo que necesita para
hacer para configurar un nuevo CarouselView

00:23:07.000 --> 00:23:11.390
y utilizar todo este discreto
características aquí.

00:23:14.340 --> 00:23:16.465
Así que IndicatorView, sí,

00:23:16.465 --> 00:23:18.580
eso es algo que
está estrechamente acoplado con

00:23:18.580 --> 00:23:21.055
el CarouselView como
Ya lo mencioné.

00:23:21.055 --> 00:23:24.775
Así que si tienes el CarouselView,

00:23:24.775 --> 00:23:26.710
también puede sabrse que una gran cantidad de

00:23:26.710 --> 00:23:29.410
estos controles tienen
este pequeño puntos en

00:23:29.410 --> 00:23:31.840
la parte inferior que muestra

00:23:31.840 --> 00:23:35.680
que cuántos elementos hay
en el CarouselView real,

00:23:35.680 --> 00:23:39.010
pero también, qué índice
actualmente ha seleccionado.

00:23:39.010 --> 00:23:41.860
Así que eso es lo que queremos
hacer con el IndicatorView.

00:23:41.860 --> 00:23:44.200
Una vez más, también en vista previa,

00:23:44.200 --> 00:23:48.625
aquí se ve un poco
código de cómo usarlo.

00:23:48.625 --> 00:23:52.435
Tenemos las opciones para, por supuesto,
hacer un poco de diseño con eso,

00:23:52.435 --> 00:23:54.339
¿cómo quieres
centrarlo horizontalmente,

00:23:54.339 --> 00:23:58.510
verticalmente, pero también de qué color
¿quieres indicar que es.

00:23:58.510 --> 00:24:00.760
¿De qué color debe
indicador seleccionado

00:24:00.760 --> 00:24:04.030
ser y qué forma desea utilizar.

00:24:04.030 --> 00:24:08.155
Así que pueden ver aquí una pequeña muestra,

00:24:08.155 --> 00:24:11.080
en esta diapositiva de aquí, el color,

00:24:11.080 --> 00:24:12.310
Ya he mencionado eso,

00:24:12.310 --> 00:24:14.290
la forma, pero se puede
también utilizar una plantilla.

00:24:14.290 --> 00:24:19.180
Así que también puede dar su propio
plantilla para el indicador,

00:24:19.180 --> 00:24:20.920
y por supuesto puedes darle un tamaño,

00:24:20.920 --> 00:24:23.305
para que puedas hacerlo más grande o más pequeño.

00:24:23.305 --> 00:24:26.860
Así que vamos a saltar rápidamente
en eso también.

00:24:26.860 --> 00:24:29.270
Tenemos muchas demostraciones.

00:24:30.530 --> 00:24:35.325
Así que mi puntero del ratón a veces
desaparece cuando cambio.

00:24:35.325 --> 00:24:39.540
Aquí vamos. Así que aquí
tener el IndicatorView.

00:24:39.540 --> 00:24:41.550
Una vez más, no se olvide de habilitarlo.

00:24:41.550 --> 00:24:43.290
Este es un muy
galería directa.

00:24:43.290 --> 00:24:46.020
Sólo tenemos uno. En iOS,

00:24:46.020 --> 00:24:48.270
nos olvidamos de utilizar el
guardar las cosas del área aquí.

00:24:48.270 --> 00:24:50.400
Así que es un poco
abajo de la parte inferior aquí,

00:24:50.400 --> 00:24:52.740
pero se puede ver, siempre que
Voy a la siguiente,

00:24:52.740 --> 00:24:56.255
se puede ver el seleccionado
aparece a la siguiente,

00:24:56.255 --> 00:24:59.440
y todo esto funciona muy bien
con el CarouselView.

00:24:59.440 --> 00:25:04.000
Podemos establecer esto para
azul si quieres,

00:25:04.000 --> 00:25:06.505
y se puede ver que todavía es negro.

00:25:06.505 --> 00:25:08.500
Puede jugar con el
tamaño aquí un poco,

00:25:08.500 --> 00:25:11.050
para que puedas hacerlo más grande o diminuto,

00:25:11.050 --> 00:25:15.370
y también se puede simplemente hacer estallar para

00:25:15.370 --> 00:25:17.380
cuadrado o podemos hacer

00:25:17.380 --> 00:25:20.815
un pequeño logotipo de Xbox de
mediante el uso de las plantillas.

00:25:20.815 --> 00:25:25.195
Esto sólo funciona en Android que veo.

00:25:25.195 --> 00:25:27.535
Porque esto es probablemente
usando una fuente de icono,

00:25:27.535 --> 00:25:31.510
Javier, que no se añade al uso.

00:25:31.510 --> 00:25:33.730
>> Pero sólo recuerde que nos clavemos por

00:25:33.730 --> 00:25:37.450
por defecto el círculo y el rectángulo

00:25:37.450 --> 00:25:41.590
porque son probablemente el
vistas de indicadores más comunes

00:25:41.590 --> 00:25:43.795
uso en aplicaciones generales,

00:25:43.795 --> 00:25:47.200
aplicación común, pero con
la plantilla del indicador,

00:25:47.200 --> 00:25:49.990
puede utilizar otra plantilla y establecer

00:25:49.990 --> 00:25:54.219
cualquier tipo de contenido
dentro de cada indicador.

00:25:54.219 --> 00:25:58.000
>> Sí. Así que rápidamente cambié
a Android y aquí se puede

00:25:58.000 --> 00:26:01.180
ver que estamos usando esto la pequeña cosa

00:26:01.180 --> 00:26:02.950
aquí para mostrar también la plantilla.

00:26:02.950 --> 00:26:07.885
Así que usted puede cargar todo en
sus indicadores lo que quiera.

00:26:07.885 --> 00:26:12.325
Así que de nuevo, esto es muy
fácil de simplemente inicializar.

00:26:12.325 --> 00:26:14.800
Tenemos el CarouselView,

00:26:14.800 --> 00:26:17.395
tiene el IndicatorView,

00:26:17.395 --> 00:26:20.245
y luego sólo dices
CarouselView.IndicatorView

00:26:20.245 --> 00:26:21.985
es este caso aquí,

00:26:21.985 --> 00:26:23.290
y estarán unidos.

00:26:23.290 --> 00:26:24.340
Se sabrá automáticamente

00:26:24.340 --> 00:26:27.340
cuántos artículos hay
en función del origen del elemento.

00:26:27.340 --> 00:26:30.760
Una última cosa que quiero notar
rápidamente es el IndicatorView

00:26:30.760 --> 00:26:33.850
se construye como un control separado
porque en el futuro,

00:26:33.850 --> 00:26:36.025
podríamos abrirlo a
otros controles también.

00:26:36.025 --> 00:26:38.830
En este momento, puede usar
para el CarouselView,

00:26:38.830 --> 00:26:41.155
pero quién sabe lo que el
futuro podría traer?

00:26:41.155 --> 00:26:43.210
Así que de esta manera tendremos

00:26:43.210 --> 00:26:46.315
la flexibilidad para
usarlo para otros controles.

00:26:46.315 --> 00:26:49.945
>> Muy bien, Javier, quieres
para hablar de RefreshView?

00:26:49.945 --> 00:26:51.610
>> Sí, en realidad.

00:26:51.610 --> 00:26:54.265
Así que vamos a continuar con más controles.

00:26:54.265 --> 00:26:58.135
En este caso, continuemos
con el RefreshView.

00:26:58.135 --> 00:27:02.140
Así que especialmente en el lanzamiento,

00:27:02.140 --> 00:27:06.595
uno de los patrones comunes en
UX para referirse a los datos es el

00:27:06.595 --> 00:27:11.890
efecto pull-to-refresh que
sugerir recuperar sus datos.

00:27:11.890 --> 00:27:13.630
Paulo, ¿qué es esta cosa de las cosas,

00:27:13.630 --> 00:27:16.615
hemos incluido un nuevo
control llamado RefreshView,

00:27:16.615 --> 00:27:21.070
que se coloca como un envoltorio
en cualquier contenido desplazable.

00:27:21.070 --> 00:27:23.800
Eso es lo importante
cosa porque

00:27:23.800 --> 00:27:28.640
sólo la mayoría de las actualizaciones
contenido desplazable.

00:27:28.710 --> 00:27:30.955
Para usar, es bastante fácil.

00:27:30.955 --> 00:27:32.230
Al final, como decimos,

00:27:32.230 --> 00:27:34.750
bloqueamos cualquier control.

00:27:34.750 --> 00:27:38.410
En este caso, estamos usando un
ListView alrededor de RefreshView.

00:27:38.410 --> 00:27:40.960
Las dos propiedades principales
se queda para refrescarse.

00:27:40.960 --> 00:27:42.205
Así es como es un booleano,

00:27:42.205 --> 00:27:45.250
que, por supuesto, podemos atar y

00:27:45.250 --> 00:27:49.300
utilizar el uso de MVPA y todos los
cosas que probablemente aman.

00:27:49.300 --> 00:27:52.225
Podemos usar también un comando para

00:27:52.225 --> 00:27:55.735
indicar y ejecutar el
lógica para actualizar la lista.

00:27:55.735 --> 00:27:58.225
Por supuesto, hay
también opciones relacionadas

00:27:58.225 --> 00:28:00.310
con personalización del control.

00:28:00.310 --> 00:28:05.005
Así que usted puede personalizar lo que es el
color del indicador de actualización,

00:28:05.005 --> 00:28:08.425
¿cuál es el color de la
fondo de la RefreshView.

00:28:08.425 --> 00:28:11.819
Todas estas cosas, que otra vez,

00:28:11.819 --> 00:28:15.300
vamos a ver
con una demostración rápida.

00:28:15.300 --> 00:28:20.230
Así que me muevo a la muestra anterior.

00:28:25.530 --> 00:28:31.850
No sé por qué estoy perdiendo
ese toque a veces.

00:28:33.150 --> 00:28:37.104
Es una locura. No sé si
esto es con la presentación,

00:28:37.104 --> 00:28:43.210
pero se puede ver en este
simulador, el resto está funcionando.

00:28:43.210 --> 00:28:47.180
>> Trabajar con las botas del emulador
muy rápido en estos días, ¿verdad?

00:28:48.600 --> 00:28:51.400
>> Ahora está funcionando. No sé.

00:28:51.400 --> 00:28:54.295
lo que sea. En este caso,

00:28:54.295 --> 00:28:56.965
tenemos muchas muestras, pero al final,

00:28:56.965 --> 00:28:58.450
lo importante es que

00:28:58.450 --> 00:29:00.265
puede utilizar con cualquier contenido desplazable,

00:29:00.265 --> 00:29:03.190
y eso significa que, por supuesto, se puede

00:29:03.190 --> 00:29:08.080
actualizar cualquier contenido que
está utilizando el ScrollView.

00:29:08.080 --> 00:29:10.975
Por supuesto, puede usar
ListView, CollectionView,

00:29:10.975 --> 00:29:16.300
y CarouselView para activar
el pull-to-refresh.

00:29:16.300 --> 00:29:18.910
Puedes usarlo, por supuesto,

00:29:18.910 --> 00:29:22.030
con el ajustador y también

00:29:22.030 --> 00:29:25.330
puede invocar directamente el
comando para, por ejemplo,

00:29:25.330 --> 00:29:28.420
pulsando un botón, mostrar

00:29:28.420 --> 00:29:32.305
IndicatorViews y
RefreshView de la misma manera.

00:29:32.305 --> 00:29:34.480
Por supuesto, también trabajó con

00:29:34.480 --> 00:29:38.590
otro tipo de controles como WebView.

00:29:38.590 --> 00:29:43.015
Ahora, creo que esto es
cargando el bloque Xamarin,

00:29:43.015 --> 00:29:47.210
y podemos tirar para refrescarlo.

00:29:47.730 --> 00:29:51.280
Un punto interesante es que,

00:29:51.280 --> 00:29:54.160
en muchos de los controles
que estamos mostrando hoy,

00:29:54.160 --> 00:29:56.439
somos algunos específicos de la plataforma.

00:29:56.439 --> 00:29:59.800
Recuerde que nuestra lógica es
específico de alguna plataforma.

00:29:59.800 --> 00:30:01.420
En este caso, en Windows,

00:30:01.420 --> 00:30:03.400
puede establecer esta detección de blancos.

00:30:03.400 --> 00:30:05.500
Puedes deslizar el dedo desde la parte superior,

00:30:05.500 --> 00:30:07.465
la parte inferior, la izquierda o la derecha.

00:30:07.465 --> 00:30:08.575
En las otras plataformas,

00:30:08.575 --> 00:30:11.515
sólo funciona desde la parte superior de forma predeterminada.

00:30:11.515 --> 00:30:13.240
El código es muy simple.

00:30:13.240 --> 00:30:20.720
Vamos a saltar a por muestra
para reutilizar con ListView.

00:30:27.210 --> 00:30:29.740
Así que aquí estamos,

00:30:29.740 --> 00:30:33.400
el ListView, por supuesto,
ligados a nuestra lista de artículos,

00:30:33.400 --> 00:30:35.290
y estamos usando el RefreshView.

00:30:35.290 --> 00:30:37.240
Para personalizar el
control, estamos usando

00:30:37.240 --> 00:30:39.400
el RefreshColor y
Propiedades BackgroundColor,

00:30:39.400 --> 00:30:42.100
pero de nuevo, la mayoría
propiedades importantes son

00:30:42.100 --> 00:30:45.610
la propiedad refrescante
y el comando.

00:30:45.610 --> 00:30:48.490
Con el botón que
ejecutar la actualización,

00:30:48.490 --> 00:30:51.070
pero lo único que
están haciendo es ejecutar lo mismo

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

00:30:55.440 --> 00:30:59.860
Continuando con más
controles porque

00:30:59.860 --> 00:31:03.985
tienen un montón de demostraciones y
más cosas para revisar,

00:31:03.985 --> 00:31:06.025
vamos a ver el SwipeView.

00:31:06.025 --> 00:31:08.500
De la misma manera que
hemos visto antes,

00:31:08.500 --> 00:31:11.320
el RefreshView que permiten hacer

00:31:11.320 --> 00:31:14.740
el gesto de tirar para actualizar sin

00:31:14.740 --> 00:31:17.650
estar asociado con
cualquier control específico.

00:31:17.650 --> 00:31:18.790
Como hemos visto antes,

00:31:18.790 --> 00:31:21.025
funciona con cualquier
Contenido [inaudible].

00:31:21.025 --> 00:31:27.385
Ahora, tenemos una opción en un
lista de elementos, por ejemplo,

00:31:27.385 --> 00:31:34.975
acceso para ejecutar un
acción en uno de los elementos.

00:31:34.975 --> 00:31:38.725
Para eso estamos permitiendo un golpe

00:31:38.725 --> 00:31:42.790
manteniendo el mando sin necesidad de
cambiar el estado de la aplicación.

00:31:42.790 --> 00:31:45.295
Para ello introducimos
el SwipeView,

00:31:45.295 --> 00:31:49.135
el SwipeView nos permite
deslizar el dedo en cualquier dirección,

00:31:49.135 --> 00:31:51.745
podemos usar también deslizar hacia arriba, abajo,

00:31:51.745 --> 00:31:53.395
de izquierda a derecha, y desde la derecha,

00:31:53.395 --> 00:31:54.970
y tenemos diferentes modos.

00:31:54.970 --> 00:31:56.200
Permítanme explicarles muy rápidamente

00:31:56.200 --> 00:31:59.350
los dos modos diferentes porque
son muy, muy diferentes.

00:31:59.350 --> 00:32:03.055
Tenemos en una mano el modo Revelar,

00:32:03.055 --> 00:32:07.300
en este modo deslizamos el dedo
para abrir el SwipeView.

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

00:32:09.340 --> 00:32:13.540
y para ejecutar ese comando que necesitamos
para tocar explícitamente uno de ellos.

00:32:13.540 --> 00:32:17.425
En el modo Ejecutar
es totalmente diferente,

00:32:17.425 --> 00:32:19.240
sólo tenemos que deslizar,

00:32:19.240 --> 00:32:22.510
y si pasamos el umbral de deslizamiento

00:32:22.510 --> 00:32:27.190
el comando asociado
con cada artículo,

00:32:27.190 --> 00:32:28.990
con cada comando será ejecutado,

00:32:28.990 --> 00:32:33.490
y si no sólo el
SwipeView se cerrará.

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

00:32:35.949 --> 00:32:38.740
este control todavía está en versión preliminar

00:32:38.740 --> 00:32:45.930
y esto necesita el uso de
la bandera experimental.

00:32:45.930 --> 00:32:52.330
Así que aquí tenemos básico
demostración mediante el SwipeView.

00:32:52.330 --> 00:32:55.045
Por supuesto, lo que estamos viendo aquí es

00:32:55.045 --> 00:32:58.690
el contenido de Deslizamiento que puede
ser cualquier tipo de contenido.

00:32:58.690 --> 00:33:02.455
Estamos aquí donde vemos
diseño básico con un nivel,

00:33:02.455 --> 00:33:05.290
y luego el SwipeItem es

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

00:33:08.755 --> 00:33:10.705
un icono, un color de fondo,

00:33:10.705 --> 00:33:15.865
y luego, por supuesto, tienen comandos
y métodos a invocar.

00:33:15.865 --> 00:33:20.785
Como se puede ver en el GIF que
veremos más adelante con una demostración,

00:33:20.785 --> 00:33:23.740
se puede deslizar en cualquier dirección.

00:33:23.740 --> 00:33:27.535
También tenemos la
BehaviorOnInvoked que se utiliza,

00:33:27.535 --> 00:33:30.970
el comportamiento que
tienen el SwipeView cuando

00:33:30.970 --> 00:33:34.825
presionamos o tocamos en
cualquiera de los comandos.

00:33:34.825 --> 00:33:37.255
Tenemos auto por defecto,

00:33:37.255 --> 00:33:40.855
eso significa que SwipeView
por defecto se cerrará.

00:33:40.855 --> 00:33:44.545
Por supuesto, podemos establecer esto
explícitamente con la opción Cerrar,

00:33:44.545 --> 00:33:47.245
pero hay otro
opción que es RemainOpen,

00:33:47.245 --> 00:33:50.260
y con esta opción
significa que si tocamos

00:33:50.260 --> 00:33:54.400
uno de los comandos de la
SwipeView permanecerá abierto.

00:33:54.400 --> 00:33:59.290
Para ejecutar e invocar cualquier acción
es fácil usar Comandos,

00:33:59.290 --> 00:34:02.770
o en este caso, el método invocado,

00:34:02.770 --> 00:34:05.260
y usarlo en Collection es

00:34:05.260 --> 00:34:09.025
muy similar a la
uso de RefreshView.

00:34:09.025 --> 00:34:10.870
Estamos usando el sitio, por ejemplo,

00:34:10.870 --> 00:34:16.780
el DataTemplate de ItemTemplate
desde un CollectionView para usar y

00:34:16.780 --> 00:34:20.845
permitir tener opciones contextuales

00:34:20.845 --> 00:34:24.295
en cada elemento de la colección.

00:34:24.295 --> 00:34:29.170
Lo último, hemos visto
SwipeItem antes son

00:34:29.170 --> 00:34:31.644
elementos muy básicos permiten

00:34:31.644 --> 00:34:34.480
para personalizar un poco
el color de fondo,

00:34:34.480 --> 00:34:35.950
puedes configurar el icono,

00:34:35.950 --> 00:34:37.000
puedes establecer el texto,

00:34:37.000 --> 00:34:42.655
pero ¿qué pasa si quieres una costumbre
contenido dentro de cualquiera de los elementos?

00:34:42.655 --> 00:34:45.280
Bueno, también presentamos
otro SwipeItem,

00:34:45.280 --> 00:34:49.975
Creo que [inaudible] SwipeItemView
que permiten cualquier tipo de vista,

00:34:49.975 --> 00:34:52.285
así que permita cualquier tipo de
contenido aquí dentro.

00:34:52.285 --> 00:34:58.525
Así que puede crear un contenido personalizado
dentro de cualquiera de los elementos de deslizamiento.

00:34:58.525 --> 00:35:03.200
Veamos una demostración
revisando todas estas cosas.

00:35:03.840 --> 00:35:07.060
Permítanme pasar de nuevo al emulador,

00:35:07.060 --> 00:35:10.100
veamos si seguimos trabajando.

00:35:13.830 --> 00:35:19.720
Así que bien, puedes deslizar el dedo
en cualquier dirección,

00:35:19.720 --> 00:35:24.950
también se puede utilizar en colecciones,

00:35:25.740 --> 00:35:31.435
bueno, déjame moverme rápidamente
personalizado SwipeView.

00:35:31.435 --> 00:35:34.420
Esto parece ser una vista de contenido,

00:35:34.420 --> 00:35:38.035
pero si deslizas el dedo para
cualquiera de las direcciones,

00:35:38.035 --> 00:35:41.800
puedes acceder a más diseños,

00:35:41.800 --> 00:35:44.515
y al final están SwipeItems.

00:35:44.515 --> 00:35:48.295
Gerald y yo tenemos algunos muy

00:35:48.295 --> 00:35:52.675
demos agradables y guapos
preparado usando todas estas cosas.

00:35:52.675 --> 00:35:55.869
Tenemos [inaudible] tiempo
para revisar todo,

00:35:55.869 --> 00:35:59.800
pero permítanme moverme muy rápidamente
por todas estas demostraciones,

00:35:59.800 --> 00:36:01.390
por ejemplo, en éste,

00:36:01.390 --> 00:36:03.610
Gerald si quieres hablar
muy rápidamente al respecto.

00:36:03.610 --> 00:36:07.030
>> Sí. Así que este
combina todas las cosas.

00:36:07.030 --> 00:36:08.650
Así que en la parte superior allí se ve

00:36:08.650 --> 00:36:12.280
un CarouselView con un
IndicatorView justo encima de él,

00:36:12.280 --> 00:36:15.370
y otro CarouselView
justo ahí abajo.

00:36:15.370 --> 00:36:16.780
Así que puedes ver que puedes crear

00:36:16.780 --> 00:36:19.330
hermosos diseños con
todo esto juntos.

00:36:19.330 --> 00:36:23.065
En la parte inferior de la casa que va a
probablemente vea un CollectionView.

00:36:23.065 --> 00:36:25.135
Así que sí, quiero decir,

00:36:25.135 --> 00:36:30.265
no deje que el diseño funcional de
nuestra aplicación de demostración te sacan de la pista.

00:36:30.265 --> 00:36:34.495
Sin duda se puede crear muy
cosas increíbles con esto.

00:36:34.495 --> 00:36:36.460
Así que Javier, quieres
para presumir rápidamente

00:36:36.460 --> 00:36:43.240
su RefreshView Custom
¿Teatro de animación?

00:36:43.240 --> 00:36:45.010
>> Vamos a mostrarlo muy rápidamente,

00:36:45.010 --> 00:36:48.820
para que podamos personalizar el
colores de RefreshView,

00:36:48.820 --> 00:36:50.020
pero en este caso, por ejemplo,

00:36:50.020 --> 00:36:51.610
lo que sucede si quieres crear

00:36:51.610 --> 00:36:54.610
un efecto personalizado de pull-to-refresh?

00:36:54.610 --> 00:36:57.370
Bueno, puedes hacerlo muy simple.

00:36:57.370 --> 00:37:02.559
Una vez más, lo que estoy haciendo aquí
está usando el SwipeView,

00:37:02.559 --> 00:37:04.420
Estoy usando el elemento superior para usar

00:37:04.420 --> 00:37:06.640
una muy hermosa animación Lottie

00:37:06.640 --> 00:37:10.465
que sólo hice basado en
en el tiempo de ejecución.

00:37:10.465 --> 00:37:13.420
Así que puedes mezclar todo este tipo de

00:37:13.420 --> 00:37:16.540
controles y cosas para crear muy,

00:37:16.540 --> 00:37:19.130
muy buenas is.

00:37:21.690 --> 00:37:26.110
Tenemos más demostraciones,
pero no mucho tiempo.

00:37:26.110 --> 00:37:28.825
Así que llegamos hasta el final.

00:37:28.825 --> 00:37:33.130
Permítanme compartir muy rápidamente donde
puedes encontrar todas estas demostraciones,

00:37:33.130 --> 00:37:37.420
y hay un montón de más
demostraciones y cosas que tenemos

00:37:37.420 --> 00:37:41.380
no se muestra porque tenemos menos tiempo,

00:37:41.380 --> 00:37:46.090
que todas estas demostraciones
necesidad de pasar uno por uno.

00:37:46.090 --> 00:37:48.850
Pero puedes encontrar todo
en estos dos enlaces.

00:37:48.850 --> 00:37:51.190
Con suerte, es útil para ti,

00:37:51.190 --> 00:37:55.009
y no sé si
tenemos preguntas.

00:37:55.890 --> 00:37:59.170
>> Sí, acabamos de
una pregunta rápida

00:37:59.170 --> 00:38:01.885
antes de entregar
a los próximos oradores,

00:38:01.885 --> 00:38:05.770
y es decir, es vista de colección

00:38:05.770 --> 00:38:10.460
tienen la carga perezosa y
infinita función de datos?

00:38:11.910 --> 00:38:15.700
>> Creo, quiero decir,

00:38:15.700 --> 00:38:18.370
usted es capaz de
implementarlo usted mismo.

00:38:18.370 --> 00:38:21.400
Probablemente podríamos hacer
más en esa área

00:38:21.400 --> 00:38:24.670
para apoyarte fuera de la caja.

00:38:24.670 --> 00:38:26.800
Pero ahora mismo, puedes hacerlo con

00:38:26.800 --> 00:38:30.535
el SwipeEvents se puede
ver qué elemento se muestra,

00:38:30.535 --> 00:38:33.610
y así puedes empezar
cargando nuevos datos.

00:38:33.610 --> 00:38:36.385
Así que sí, eso es definitivamente posible.

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

00:38:37.180 --> 00:38:38.890
>> Por defecto, el
CollectionView han

00:38:38.890 --> 00:38:41.575
algunos comandos para detectar
cuando llegues al final,

00:38:41.575 --> 00:38:43.810
y muchos más datos,
y todas estas cosas.

00:38:43.810 --> 00:38:46.300
Así que todo este tipo de
cosas es posible.

00:38:46.300 --> 00:38:47.845
>> Mucho más fácil que con ListView.

00:38:47.845 --> 00:38:48.655
>> Sí.

00:38:48.655 --> 00:38:51.850
>> Suena genial. Muy bien.
Muchas gracias por su charla,

00:38:51.850 --> 00:38:54.805
y ahora, se lo devuelvo a James.

00:38:54.805 --> 00:38:56.965
>> Impresionante. Muchas gracias

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

00:38:59.605 --> 00:39:02.560
Súper impresionante. Me encanta todo el
características increíbles que están sucediendo.

00:39:02.560 --> 00:39:05.200
Ahora, estoy muy emocionado
porque en vivo desde Italia,

00:39:05.200 --> 00:39:07.870
Codrina está aquí para hablar
a nosotros acerca de cómo podemos

00:39:07.870 --> 00:39:10.630
en realidad poner a prueba nuestro
Aplicaciones Xamarin,

00:39:10.630 --> 00:39:12.700
nuestra interfaz de usuario y nuestro código fuente.

00:39:12.700 --> 00:39:16.625
Codrina, voy a hacer estallarlo
a usted y se lo llevó.

00:39:16.625 --> 00:39:19.560
>> Gracias, James. Hola a todos,

00:39:19.560 --> 00:39:24.105
y voy a compartir mi pantalla,

00:39:24.105 --> 00:39:28.570
y estaré listo para empezar.