Align visual components

Asked

Viewed 1,120 times

3

I’m having trouble aligning the buttons/icons on my Active. I’m using relative layout to position the buttons, but when compiling it gets out of order.

Follows the code:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent" android:layout_height="match_parent">


    <TextView
        android:text="@string/lbl_debitos_pendentes"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/lbl_debitosPendentes"
        android:layout_below="@+id/btnDebitosPendentes"
        android:layout_alignRight="@+id/btnDebitosPendentes"
        android:layout_alignEnd="@+id/btnDebitosPendentes" />

    <TextView
        android:text="@string/lbl_dados_cadastrais"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/lbl_dados_cadastrais"
        android:layout_below="@+id/btnDadosCadastrais"
        android:layout_alignRight="@+id/btnDadosCadastrais"
        android:layout_alignEnd="@+id/btnDadosCadastrais" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/lbl_dados_cadastrais"
        android:layout_alignRight="@+id/lbl_dados_cadastrais"
        android:layout_alignEnd="@+id/lbl_dados_cadastrais"
        android:layout_marginTop="14dp"
        android:id="@+id/btnHistoricoPagamento"
        android:background="@drawable/historic_pgto" />

    <TextView
        android:text="@string/lbl_hist_pagamento"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/lbl_historicoPagamento"
        android:layout_below="@+id/btnHistoricoPagamento"
        android:layout_alignLeft="@+id/btnHistoricoPagamento"
        android:layout_alignStart="@+id/btnHistoricoPagamento" />

    <Button

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnSolicitarAtendimento"
        android:background="@drawable/soli_atend"
        android:layout_above="@+id/lbl_historicoPagamento"
        android:layout_alignLeft="@+id/lbl_debitosPendentes"
        android:layout_alignStart="@+id/lbl_debitosPendentes" />

    <TextView
        android:text="@string/lbl_hist_atendimentos"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/lbl_hist_atendimento"
        android:layout_below="@+id/btnHistoricoAtendimento"
        android:layout_toLeftOf="@+id/btnSolicitarAtendimento"
        android:layout_toStartOf="@+id/btnSolicitarAtendimento" />

    <TextView
        android:text="@string/lbl_grafico"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView15"
        android:layout_below="@+id/button32"
        android:layout_alignRight="@+id/button32"
        android:layout_alignEnd="@+id/button32" />

    <TextView
        android:text="@string/lbl_solicitar_atendimento"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/lbl_solic_atendimento"
        android:layout_below="@+id/btnSolicitarAtendimento"
        android:layout_alignLeft="@+id/btnSolicitarAtendimento"
        android:layout_alignStart="@+id/btnSolicitarAtendimento"
        android:layout_marginLeft="18dp"
        android:layout_marginStart="18dp" />

    <Button

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/lbl_hist_atendimento"
        android:layout_alignRight="@+id/btnHistoricoAtendimento"
        android:layout_alignEnd="@+id/btnHistoricoAtendimento"
        android:layout_marginTop="24dp"
        android:id="@+id/btnExtratoAutenticacao"
        android:background="@drawable/extrato" />

    <TextView
        android:text="@string/lbl_extrato_autenticacao"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/textView16"
        android:layout_below="@+id/btnExtratoAutenticacao"
        android:layout_alignLeft="@+id/btnExtratoAutenticacao"
        android:layout_alignStart="@+id/btnExtratoAutenticacao"
        android:layout_marginTop="12dp" />

    <TextView
        android:text="@string/lbl_contato"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBottom="@+id/textView16"
        android:layout_alignRight="@+id/lbl_debitosPendentes"
        android:layout_alignEnd="@+id/lbl_debitosPendentes"
        android:id="@+id/textView17" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/button32"
        android:background="@drawable/grafico"
        android:layout_below="@+id/lbl_solic_atendimento"
        android:layout_alignRight="@+id/lbl_solic_atendimento"
        android:layout_alignEnd="@+id/lbl_solic_atendimento" />

    <Button

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnContato"
        tools:background="@drawable/mapa"
        android:layout_above="@+id/textView17"
        android:layout_alignRight="@+id/textView17"
        android:layout_alignEnd="@+id/textView17" />

    <Button

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="34dp"
        android:layout_marginStart="34dp"
        android:layout_marginTop="28dp"
        android:id="@+id/btnDadosCadastrais"
        android:background="@drawable/user_edit"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true" />

    <Button

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnDebitosPendentes"
        tools:ignore="RelativeOverlap,RtlHardcoded"
        tools:background="@drawable/doc_abe"
        android:layout_marginLeft="20dp"
        android:layout_marginStart="20dp"
        android:layout_alignBaseline="@+id/btnDadosCadastrais"
        android:layout_alignBottom="@+id/btnDadosCadastrais"
        android:layout_toRightOf="@+id/textView16"
        android:layout_toEndOf="@+id/textView16" />

    <Button

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/btnHistoricoAtendimento"
        tools:background="@drawable/history"
        android:layout_alignParentBottom="true"
        android:layout_alignLeft="@+id/lbl_historicoPagamento"
        android:layout_alignStart="@+id/lbl_historicoPagamento" />

</RelativeLayout>

Buttons/icons should be aligned 2 in 2.

  • At first I suffered even using linear layout. This type of layout is simple and compatible tone new and old versions. Using the horizontal and vertical format will be able to do everything you want.

3 answers

1

The icon would be the button or not? if it is you can use the code below:

<Button
android:id="@+id/buttonIdDoesntMatter"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:text="buttonName"
android:drawableLeft="@drawable/imageWillChange"
android:onClick="listener"
android:layout_width="fill_parent">

now if it is in the layout you can put the Linearlayout and set the layou_gravity="center". However if your screen is to have many elements that you can think about when inflating the screen, then if you have a lot it may be better to use the Constraintlayout remembering that he is still in alpha.

  • Yes the icon is the button, only I’m mounting a menu screen, has 8 buttons and I will need to control by user access. That way you sent the code I can’t solve, there’s another way you know it?. @Jeffersonrodridossantos.

0


I solved the problem

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="match_parent">
<GridLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:columnCount="2"
    android:rowCount="8">




    <Button

        android:layout_width="90dp"
        android:layout_height="90dp"
        android:id="@+id/btnDadosCadastrais"
        android:background="@drawable/user_edit"
        android:layout_marginLeft="50dp"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <Button

        android:layout_width="90dp"
        android:layout_height="90dp"
        android:id="@+id/btnDebitosPendentes"
        android:background="@drawable/doc_abe"
        android:layout_marginLeft="85dp"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <TextView
        android:text="@string/lbl_dados_cadastrais"
        android:layout_width="87dp"
        android:layout_height="34dp"
        android:id="@+id/txtDadosCadastrais"
        android:layout_marginLeft="50dp"
        tools:ignore="RtlHardcoded"
        android:layout_margin="5dp" />

    <TextView
        android:text="@string/lbl_debitos_pendentes"
        android:layout_width="90dp"
        android:layout_height="34dp"
        android:id="@+id/txtDebitosPendentes"
        android:layout_marginLeft="85dp"
        tools:ignore="RtlHardcoded"
        android:layout_margin="5dp" />

    <Button

        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_marginLeft="50dp"
        android:id="@+id/btnHistoricoDePagamento"
        android:background="@drawable/historic_pgto"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <Button
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:id="@+id/btnSolicitarAtendimento"
        android:layout_marginLeft="85dp"
        android:background="@drawable/soli_atend"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <TextView

        android:text="@string/lbl_hist_pagamento"
        android:layout_width="87dp"
        android:layout_height="34dp"
        android:id="@+id/txtHitoricoPagamento"
        android:layout_marginLeft="50dp"
        tools:ignore="RtlHardcoded"
        android:layout_margin="5dp" />

    <TextView
        android:text="@string/lbl_solicitar_atendimento"
        android:layout_width="90dp"
        android:layout_height="34dp"
        android:id="@+id/txtSolicitarAtendimento"
        android:layout_marginLeft="85dp"
        tools:ignore="RtlHardcoded"
        android:layout_margin="5dp" />

    <Button

        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_marginLeft="50dp"
        android:id="@+id/btnHistoricoAtendimentos"
        android:background="@drawable/history"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <Button
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_marginLeft="85dp"
        android:id="@+id/btnGraficoDeUso"
        android:background="@drawable/grafico"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <TextView
        android:text="@string/lbl_hist_atendimentos"
        android:layout_width="87dp"
        android:layout_height="34dp"
        android:layout_marginLeft="50dp"
        android:id="@+id/txtHistoricoAtendimento"
        tools:ignore="RtlHardcoded" />

    <TextView
        android:text="@string/lbl_grafico"
        android:layout_width="90dp"
        android:layout_height="34dp"
        android:id="@+id/txtGraficoDeUso"
        android:layout_marginLeft="85dp"
        tools:ignore="RtlHardcoded" />

    <Button
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_marginLeft="50dp"
        android:id="@+id/btnExtratoDeAutenticacao"
        android:background="@drawable/extrato"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />

    <Button
        android:layout_width="90dp"
        android:layout_height="90dp"
        android:layout_marginLeft="85dp"

        android:id="@+id/btnContato"
        android:background="@drawable/mapa"
        tools:ignore="RtlHardcoded"
        android:layout_margin="15dp" />


    <TextView
        android:text="@string/lbl_extrato_autenticacao"
        android:layout_width="87dp"
        android:layout_height="34dp"
        android:layout_marginLeft="50dp"
        android:id="@+id/txtExtratoAutenticao"
        tools:ignore="RtlHardcoded" />

    <TextView
        android:text="@string/lbl_contato"
        android:layout_width="90dp"
        android:layout_height="34dp"
        android:id="@+id/txtContato"
        android:layout_marginLeft="85dp"
        tools:ignore="RtlHardcoded" />

</GridLayout>

</ScrollView>

-1

 <ImageView
   android:id="@+id/username_icon"
   android:layout_width="40dp"
   android:layout_height="40dp"
   android:layout_alignParentLeft="true"
   android:layout_alignParentStart="true"
   android:layout_marginTop="20dp"
   android:padding="3dp"
   android:src="@drawable/ic_mail_black_24dp" />

   <android.support.design.widget.TextInputLayout
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_marginLeft="4dp"
     android:layout_marginStart="4dp"

     android:layout_alignBottom="@+id/username_icon"
     android:layout_toRightOf="@+id/username_icon"
     android:layout_toEndOf="@+id/username_icon">

     <EditText
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:hint="@string/e_mail"
       android:id="@+id/editTextEmail"
       android:layout_alignTop="@+id/username_icon"
       android:layout_toRightOf="@+id/username_icon"
       android:layout_toEndOf="@+id/username_icon"
       android:inputType="textEmailAddress" />
  </android.support.design.widget.TextInputLayout>

It’ll look something like this:

inserir a descrição da imagem aqui

Browser other questions tagged

You are not signed in. Login or sign up in order to post.