Para adicionar uma imagem na tela do aplicativo é preciso usar o componente ImageView. Assim, clique neste elemento na aba Images da aba Palette e  arreste para inserir abaixo do elemento welcomeTextView.

Figura 28. Localização do componente ImageView na paleta

Ao soltar o botão do mouse, uma nova janela Pick a resource irá abrir. Na caixa de busca encontre a imagem previamente adicionada aos recursos do nosso aplicativo  e clique em OK.

Figura 29. Selecionando uma imagem dos recursos para ser mostrada pela ImageView

O próximo passo é configurar o componente da imagem. Modifique as seguintes propriedades:

• id: welcomeImageView
• layout_height: 0dp
• layout:gravity: center
  
• layout:weight: 4

Para fazer o uso correto das proporções nas imagens a propriedade altura (height) deve ser configurada como 0dp. Uma altura zero significaria que o elemento deveria praticamente não ser desenhado na tela, porém como estamos fazendo o uso das proporções do LinearLayout a nova altura é calculada na hora para manter a proporção correta na tela. O resultado final é o aplicativo exibindo uma imagem ocupando a proporção de 4/5 da tela.   

Figura 30. Visualização do aplicativo com a ImageView