使用布局对组件进行分组

时间:2015-11-29 22:34:01

标签: android android-layout

我的目标是让我的图表与我的其他组件并排。

我尝试了不同布局的这么多个小时,但我不能让它并排。 我的想法是将除了图表之外的所有组件分组在一个布局中,将图表分组在另一个布局中,然后将它们并排放置。但是我无法让它发挥作用。

现在的样子: enter image description here

使用截至目前的代码:

<?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" android:paddingLeft="@dimen/activity_horizontal_margin"
android:id="@+id/mainLayout"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

<com.github.mikephil.charting.charts.PieChart
    android:id="@+id/pieChartLineLayout"
    android:layout_width="150dp"
    android:layout_height="200dp" />

<SeekBar
    android:layout_width="150dp"
    android:layout_height="15dp"
    android:id="@+id/seekBar"
    android:thumbTint="@color/orange"
    android:maxHeight="4dip"
    android:minHeight="4dip"
    android:layout_marginTop="60dp"
    android:layout_below="@+id/pieChartLineLayout"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true" />

<SeekBar
    android:layout_width="150dp"
    android:layout_height="15dp"
    android:id="@+id/seekBar2"
    android:maxHeight="4dip"
    android:minHeight="4dip"
    android:thumbTint="@color/red"
    android:layout_below="@+id/textView4"
    android:layout_alignRight="@+id/textView2"
    android:layout_alignEnd="@+id/textView2" />

<SeekBar
    android:layout_width="150dp"
    android:layout_height="15dp"
    android:maxHeight="4dip"
    android:minHeight="4dip"
    android:thumbTint="@color/blue"
    android:id="@+id/seekBar3"
    android:layout_below="@+id/textView5"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="0%"
    android:textColor="#FFFFFF"
    android:background="@drawable/rounded_corner_orange"
    android:id="@+id/textView"
    android:paddingLeft="4dp"
    android:paddingRight="4dp"
    android:layout_marginBottom="16dp"
    android:layout_alignBottom="@+id/seekBar"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="Carbohydrates"
    android:id="@+id/textView2"
    android:textStyle="bold"
    android:paddingLeft="10dp"
    android:layout_alignBottom="@+id/textView"
    android:layout_toRightOf="@+id/textView"
    android:layout_toEndOf="@+id/textView" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="0%"
    android:textColor="#FFFFFF"
    android:background="@drawable/rounded_corner_reds"
    android:id="@+id/textView3"
    android:layout_marginTop="12dp"
    android:paddingLeft="4dp"
    android:paddingRight="4dp"
    android:layout_below="@+id/seekBar"
    android:layout_toLeftOf="@+id/textView4"
    android:layout_toStartOf="@+id/textView4" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="Proteins"
    android:id="@+id/textView4"
    android:paddingLeft="10dp"
    android:textStyle="bold"
    android:layout_alignTop="@+id/textView3"
    android:layout_alignLeft="@+id/textView2"
    android:layout_alignStart="@+id/textView2" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="0%"
    android:textColor="#FFFFFF"
    android:background="@drawable/rounded_corner_blue"
    android:id="@+id/textView5"
    android:layout_marginTop="14dp"
    android:paddingLeft="4dp"
    android:paddingRight="4dp"
    android:layout_below="@+id/seekBar2"
    android:layout_toLeftOf="@+id/textView6"
    android:layout_toStartOf="@+id/textView6" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:text="Fats"
    android:id="@+id/textView6"
    android:textStyle="bold"
    android:paddingLeft="10dp"
    android:layout_alignTop="@+id/textView5"
    android:layout_alignLeft="@+id/textView4"
    android:layout_alignStart="@+id/textView4" />

 </RelativeLayout>

1 个答案:

答案 0 :(得分:0)

用户LinearLayout作为您的容器(水平方向)。然后将饼图添加到其中,另一个是垂直LinearLayout,其中包含搜索栏。