ATLSingleImage

Esta molécula é utilizada para mostrar uma única imagem.

Para visitar a documentação de design desta molécula, clique aqui.

Exemplo de Uso:

import { ATLSingleImage } from '@appsimples/atlantica-react-native'
...
 <ATLSingleImage 
    source={image} 
    type={ImagePickerTypeEnum.cover} 
    hasMargin
/>

Props

• source
• placeholderImage
• type
• hasMargin
• hasOverlay
• horizontalMargin
• resizeMode
• verticalMargin
• imageBaseProps

---

source

Imagem que foi selecionada pelo usuário. Caso não seja fornecida, o componente mostra o placeholder ou um quadrado cinza.

Tipo	Obrigatório
ImageSourcePropType	Não

---

placeholderImage

Imagem de placeholder do avatar do usuário.

Tipo	Obrigatório
ImageSourcePropType	Não

---

type

Tipo de picker. O que varia em cada um dos tipos é o tamanho.

Tipo	Obrigatório
ImagePickerTypeEnum	Não

Os possíveis tipos são:

• cover (token ProportionCover, valor padrão: '12:5')
• image (token ProportionImage, valor padrão: '1:1')
• video (token ProportionVideo, valor padrão: '16:9')

O valor padrão é image

---

hasMargin

Determina se a molécula possui todas as margens ou apenas a inferior.

Tipo	Obrigatório
boolean	Não

---

hasOverlay

Determina se a molécula possui uma camada de transparência colorida por cima dela.

Tipo	Obrigatório
boolean	Não

---

horizontalMargin

Essa propriedade deve ser modificada caso seja necessário alterar a margem horizontal externa aos elementos da molécula.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
horizontalMargin	SpacingMarginal	16

---

resizeMode

Tipo de redimensionamento da imagem.

Tipo	Obrigatório
ImageResizeModeEnum	Não

Os possíveis valores de ImageResizeModeEnum são:

• contain
• cover
• stretch
• center
• repeat

---

verticalMargin

Essa propriedade deve ser modificada caso seja necessário alterar a margem vertical externa aos elementos da molécula.

Abaixo temos uma tabela indicando o token ao qual a prop está relacionada e o seu valor padrão.

Prop	Token	Default Value
verticalMargin	SpacingBase	8

---

imageBaseProps

Caso seja necessário mudar alguma propriedade base do átomo de imagem, é possível através da modificação das imageBaseProps.

Abaixo temos uma tabela com todas as props da imagem, os tokens aos quais estão relacionadas e o seu valor padrão.

Prop	Token	Default Value
borderColor	ColorNone	'transparent'
borderRadius	(fixed)	0
borderWidth	(fixed)	0
height	(fixed)	SCREEN_WIDTH * ProportionImage
opacity	(fixed)	1
overlayColor	ColorSecondary	#A6FC8E
overlayOpacity	OpacityImageOverlay	0.85

Para mais informações, acesse ATLImageBase.