Question

我正在尝试在android中创建这样的东西：

我目前的方法是尝试使用linearLayout和一些具有不同权重的视图创建条形图。这很好用：

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

    <LinearLayout
        android:id="@+id/market_bar"
        android:orientation="horizontal"
        android:layout_width="match_parent"
        android:layout_height="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <View
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="0.2"
                android:background="@android:color/holo_red_light"/>

            <View
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="0.8"
                android:background="@android:color/holo_green_dark"/>
            </LinearLayout>

    </LinearLayout>

</RelativeLayout>

但是现在我如何添加图片中出现的标记？我不认为我可以用重量实现这一目标。例如，如何将标记放在条形的末尾？

谢谢

Answer 1

我使用FrameLayout更改了LinearLayout以改进代码。
这是图形布局：

Graphical layout

这是代码：

<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:id="@+id/actual"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:paddingLeft="40dp"
        android:text="Actual" />


    <FrameLayout
        android:id="@+id/market_bar"
        android:layout_width="match_parent"
        android:layout_below="@id/actual"
        android:layout_height="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent" >

            <View
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="0.7"
                android:background="@android:color/holo_red_light" />

            <View
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="0.3"
                android:background="@android:color/holo_green_dark" />
        </LinearLayout>
    </FrameLayout>

    <TextView
        android:id="@+id/apertura"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/market_bar"
        android:layout_alignParentLeft="true"
        android:paddingLeft="120dp"
        android:text="Apertura" />

</RelativeLayout>

我建议您也查看此链接：
http://developer.android.com/guide/topics/ui/layout/relative.html

Answer 2

如果你想构建一个静态视图或类似于交互式双滑块的东西，我没有得到。顺便说一句，考虑到第一种情况，您可以通过调整android:layout_marginLeft来移动标记。

基于您的代码的示例：

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

<LinearLayout
    android:id="@+id/market_bar"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_marginLeft="20dp"
    android:layout_marginRight="20dp">
    <View
        android:layout_width="10dp"
        android:layout_height="20dp"
        android:background="@android:color/holo_orange_dark"/>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="20dp">

        <View
            android:layout_width="0dp"
            android:layout_height="20dp"
            android:layout_weight="0.2"
            android:background="@android:color/holo_red_light"/>

        <View
            android:layout_width="0dp"
            android:layout_height="20dp"
            android:layout_weight="0.8"
            android:background="@android:color/holo_green_dark"/>
    </LinearLayout>
    <View
        android:layout_width="10dp"
        android:layout_height="20dp"
        android:layout_marginLeft="310dp"
        android:background="@android:color/holo_orange_dark"/>
</LinearLayout>

</RelativeLayout>

如何使用％将ImageView定位在LinearLayout之上？

2 个答案: