You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Update ES version of layouts, fix typos and improve grammar. (#174)
* Translate introduction
* Add es index ejs
* Translate quick start
* Translate installation
* Translate template
* Translate ns plugin
* Translate vue plugins
* Translate manual routing
* Translate v-view
* Translate dialog
* Translate confirm
* Translate alert
* Translate activity indicator
* Translate html view
* Translate progress
* Translate label
* Fix components directory and translate switch
* Translate web view
* Translate button
* Translate image
* Translate date picker
* Translage list picker
* Translage list picker and time picker
* Translate list view
* Translate scroll view
* Translate search bar
* Translate confirm
* Translate prompt
* Add es to build process
* Translate action bar
* Translate action item
* Transalate nav button
* Translate slider
* Translate tab view
* Translate text field
* Translate segmented bar
* Translate text view
* Translate absolute layout
* Translate stack layout
* Translate wrap layout
* Translate dock layout
* Translate flexbox layout
* Translate grid layout
* Translate v-template
* Translate vue router
* Translate playground tutorial
* Fix typos and improve grammar
* Rename index._es.ejs to index_es.ejs
* update sponsors list
* Update es version of absolute layout
* Fix es typos and improve grammar
* Update es version of dock layout
* Update es version of flex layout
* Make en flex layout more consistent
* Update es version of grid layout
* Update es version of stack layout
* Update es version of wrap layout
* Make en stack & wrap layouts more consistent
`<FlexboxLayout>` is a layout container that provides a non-exact implementation of the [CSS Flexbox layout](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox). This layout lets you arrange child components both horizontally and vertically.
8
8
9
-
###Examples
9
+
## Examples
10
10
11
-
####Default flex layout
11
+
### Default flex layout
12
12
13
13
The following example creates a row of three equally-sized elements that span across the entire height of the screen.
14
14
@@ -21,9 +21,9 @@ The following example creates a row of three equally-sized elements that span ac
####Column flex layout with reverse order and items with a different `alignSelf`
77
+
### Column flex layout with reverse order and items with a different `alignSelf`
78
78
79
79
The following example shows how to use:
80
80
@@ -109,8 +109,8 @@ When an element is a direct child of `<FlexboxLayout>`, you can work with the fo
109
109
110
110
| Name | Type | Description |
111
111
|------|------|-------------|
112
-
`order` | `Number` | Sets the order in which child element appear in relation to one another.
112
+
`order` | `Number` | Sets the order in which child element appear in relation to one another.
113
113
`flexGrow` | `Number` | Indicates that the child should grow in size, if necessary. Sets how much the child will grow in proportion to the rest of the child elements in the flex container.
114
114
`flexShrink` | `Number` | Indicates that the child should shrink when the row runs out of space. Sets how much the flex item will shrink in proportion to the rest of the child elements in the flex container. When not specified, its value is set to `1`.
115
115
`alignSelf` | `String` | (Android-only) Overrides the `alignItems` value for the child.<br/>Valid values:<br/>`flex-start` (cross-start margin edge of the item is placed on the cross-start line),<br/>`flex-end` (cross-end margin edge of the item is placed on the cross-end line),<br/>`center` (item is centered on the cross axis),<br/>`baseline` (the item baselines are aligned), and<br/>`stretch` (items is stretched to fill the container but respects `min-width` and `max-width`).<br/>Default value: `stretch`.
116
-
`flexWrapBefore` | `Boolean` | When `true`, forces the item to wrap onto a new line. This property is not part of the official Flexbox specification.<br/>Default value: `false`.
116
+
`flexWrapBefore` | `Boolean` | When `true`, forces the item to wrap onto a new line. This property is not part of the official Flexbox specification.<br/>Default value: `false`.
`<StackLayout>` is a layout container that lets you stack the child elements vertically (default) or horizontally.
8
8
9
-
### Samples
9
+
##Examples
10
10
11
-
####Default stacking
11
+
### Default stacking
12
12
13
13
The following example creates a vertical stack of 3 equally-sized elements. Items are stretched to cover the entire width of the screen. Items are placed in the order they were declared in.
14
14
@@ -21,7 +21,7 @@ The following example creates a vertical stack of 3 equally-sized elements. Item
The following example creates a horizontal stack of 3 equally-sized elements. Items are stretched to cover the entire height of the screen. Items are placed in the order they were declared in.
27
27
@@ -34,7 +34,7 @@ The following example creates a horizontal stack of 3 equally-sized elements. It
`<WrapLayout>` is a layout container that lets you position items in rows or columns, based on the `orientation` property. When the space is filled, the container automatically wraps items onto a new row or column.
8
8
9
-
### Samples
9
+
### Examples
10
10
11
-
####Default wrap layout
11
+
### Default wrap layout
12
12
13
13
The following example creates a row of equally-sized items. When the row runs out of space, the container wraps the last item on a new row.
14
14
@@ -23,7 +23,7 @@ The following example creates a row of equally-sized items. When the row runs ou
Copy file name to clipboardExpand all lines: content/docs/es/elements/components/list-view.md
+1-1Lines changed: 1 addition & 1 deletion
Original file line number
Diff line number
Diff line change
@@ -23,7 +23,7 @@ contributors: [ianaya89]
23
23
24
24
El componente [`<v-template>`](/en/docs/utilities/v-template) es utilizado para definir como se va a mostrar cada elemento de la lista dentro de la pantalla.
25
25
26
-
Si necesitas visualizar uno o mas elementos de manera diferente al resto, puedes ingresarlos como hijos de un componente `<v-template>` y utilizar las condiciones que sean necesarias. Dentro de un `<ListView>`, puedes usar todos los `<v-template>` que creas necesarios.
26
+
Si necesitas visualizar uno o más elementos de manera diferente al resto, puedes ingresarlos como hijos de un componente `<v-template>` y utilizar las condiciones que sean necesarias. Dentro de un `<ListView>`, puedes usar todos los `<v-template>` que creas necesarios.
27
27
28
28
```html
29
29
<ListViewfor="item in listOfItems"@itemTap="onItemTap">
`<TextView>` es un componente de UI que muestra un contenedor de texto editable o de solo-lectura. Puedes utilizarlo para permitir que el usuario ingrese grande cantidades de texto o simplemente para mostrar texto en mas de una línea.
7
+
`<TextView>` es un componente de UI que muestra un contenedor de texto editable o de solo-lectura. Puedes utilizarlo para permitir que el usuario ingrese grande cantidades de texto o simplemente para mostrar texto en más de una línea.
8
8
9
9
El componente `<TextView>` extiende a [`TextBase`](https://docs.nativescript.org/api-reference/classes/_ui_text_base_.textbase) y a[`EditableTextBase`](https://docs.nativescript.org/api-reference/classes/_ui_editor_text_base_.editabletextbase),agregando propiedades y eventos adicionales.
El contenedor `AbsoluteLayout` es el *layout* mas simple de NativeScript. Usa coordenadas absolutas para posicionar los componentes hijos a partir del vértice superior izquierdo.
8
+
9
+
El contenedor `AbsoluteLayout` es el *layout* más simple de NativeScript. Usa coordenadas absolutas para posicionar los componentes hijos a partir del vértice superior izquierdo.
8
10
`AbsoluteLayout` no aplicará ninguna restricción de diseño a tus elementos hijos y tampoco los redimensionará en tiempo de ejecución (cuando cambie su tamaño).
9
11
10
-
### Ejemplos
12
+
El contenedor `<AbsoluteLayout>` es el *layout* más simple de NativeScript
13
+
14
+
`<AbsoluteLayout>` se comporta de la siguiente forma:
15
+
16
+
* Usa un par de coordinadas absolutas izquierda/derecha para posicioanr los elementos hijos.
17
+
***No** fuerza ningún tipo de restricción de posicionamiento sobre los elementos hijos.
18
+
***No** redimensiona los elementos hijos en tiempo de ejecución, cuando estos cambien de tamaño.
19
+
20
+
## Ejemplos
11
21
12
-
#### Diseño de tipo grilla
22
+
### Diseño de tipo grilla
23
+
24
+
El siguiente ejemplo crea una grilla simple. Para más información sobre *layouts* de grillas puedes ver [GridLayout](/es/docs/elements/layouts/grid-layout).
13
25
14
26
```html
15
27
<AbsoluteLayoutbackgroundColor="#3c495e">
@@ -21,7 +33,9 @@ El contenedor `AbsoluteLayout` es el *layout* mas simple de NativeScript. Usa co
Cuando un elemento es hijo directo de `AbsoluteLayout`, las siguientes propiedades pueden ser utilizadas en ese elemento hijo:
54
+
Cuando un elemento es hijo directo de AbsoluteLayout, las siguientes propiedades pueden ser utilizadas en ese elemento hijo:
42
55
43
-
|Nombre|Tipo|Descripción|
56
+
|Name|Type|Description|
44
57
|------|------|-------------|
45
-
| `top` | `Number` | Representa la distancia desde el margen superior del `AbsoluteLayout`
46
-
| `left` | `Number` | Representa la distancia desde el margen izquierdo del `AbsoluteLayout`
58
+
| `top` | `Number` | Obtiene o establece la distancia (en píxeles) entre el borde superior del elemento hijo y el borde superior del elemento padre.
59
+
| `left` | `Number` | Obtiene o establece la distancia (en píxeles) entre el borde izquierdo del elemento hijo y el borde izquierdo del elemento padre.
El contenedor `DockLayout` provee un mecanismo de acoplamiento para los elementos hijos, basado en los valores `left`, `right`, `top`, `bottom`. Para definir el tipo de acoplamiento de un elemento hijo, se puede utilizar la propiedad `dock`. Para acoplar un elemento hijo en el centro de un `DockLayout`, este deberá ser el último hijo del contenedor`DockLayout` y la propiedad de `stretchLastChild` (de `DockLayout`) deberá tener el valor `true`.
7
+
El contenedor `DockLayout` provee un mecanismo de acoplamiento para los elementos hijos que permite ubicalor a los costados o en el centro del contenedor.
8
8
9
-
### Ejemplos
9
+
`<DockLayout>` se comporta de la siguiente forma:
10
10
11
-
#### Acoplar a cada lado sin estirar el último elemento hijo
11
+
* Usa la propiedad `dock` para ubicar los elementos con los valores: `left`, `right`, `top`, `bottom`.
12
+
* Permite acoplar un elemento hijo en el centro del contenedor. En ese caso, este deberá ser el último hijo del contenedor `<DockLayout>` y la propiedad de `stretchLastChild` (de `<DockLayout>`) deberá tener el valor `true`.
13
+
* Fuerza restricciones de posicionamiento sobre los elementos hijos.
14
+
* Redimensiona los elementos hijos en tiempo de ejecucion, cuando estos cambian de tamaño.Resizes its children at runtime when its size changes.
15
+
16
+
## Ejemplos
17
+
18
+
### Acoplar a cada lado sin estirar el último elemento hijo
#### Acoplar a cada lado estirando el último elemento hijo
30
+
### Acoplar a cada lado estirando el último elemento hijo
31
+
32
+
El siguiente ejemplo muestra como la propiedad `stretchLastChild` afecta la posicion de los elementos hijos en un contenedor `<DockLayout>`. El último elemento (con el la propiedad `dock="bottom"`), es estirado para que ocupe el resto del espacio disponible luego del posicionamiento de los primeros tres elementos.
El siguiente ejemplo crea un contenedor `<DockLayout>` de cinco elementos. Los primeros cuatro elementos envuelven al elemento del centro en un cuadro.
0 commit comments