如何在地图片段 API v2 布局顶部添加按钮

Posted 2023-05-06

【中文标题】如何在地图片段 API v2 布局顶部添加按钮

【英文标题】：How to add buttons at top of map fragment API v2 layout

【发布时间】：2013-01-19 14:06:55

【问题描述】：

我正在尝试使用 API v2 在 android 中显示地图。 我想要这样的 UI。但每当 我尝试在布局中添加按钮时，它不会反映在输出中我能够获得没有按钮的地图。我需要按钮来与下面的地图集成 Mylayout.xml 的代码：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
tools:context=".MapActivity" >
<RelativeLayout
android:layout_
android:layout_>
<LinearLayout 
android:layout_
android:layout_
android:orientation="horizontal">
<RadioGroup 
android:id="@+id/radio_group_list_selector"
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:layout_weight="1"

>
<RadioButton
android:id="@+id/radioPopular"
android:layout_
android:layout_
android:gravity="center_horizontal|center_vertical"
android:text="@string/Popular"
android:layout_weight="1"
android:button="@null"
android:background="@drawable/shape_radiobutton"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp"
android:layout_marginLeft="4dp"
android:textColor="@drawable/textcolor_radiobutton"

/>
<View
android:id="@+id/VerticalLine"
android:layout_
android:layout_
android:layout_marginBottom="4dip"
android:layout_marginTop="4dip"
android:background="#aaa"
            />
<RadioButton
android:id="@+id/radioAZ"
android:layout_
android:layout_
android:gravity="center_horizontal|center_vertical"
android:text="@string/AZ"
android:layout_weight="1"
android:button="@null"
android:background="@drawable/shape_radiobutton2"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp"
android:textColor="@drawable/textcolor_radiobutton"

/>
 <View
android:id="@+id/VerticalLine"
android:layout_
android:layout_
android:layout_marginBottom="4dip"
android:layout_marginTop="4dip"
android:background="#aaa"
            />
<RadioButton
android:id="@+id/radioCategory"
android:layout_
android:layout_
android:gravity="center_horizontal|center_vertical"
android:text="@string/Category"
android:layout_weight="1"
android:button="@null"
android:background="@drawable/shape_radiobutton2"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp"
android:textColor="@drawable/textcolor_radiobutton"

/>
<View
android:id="@+id/VerticalLine"
android:layout_
android:layout_
android:layout_marginBottom="4dip"
android:layout_marginTop="4dip"
android:background="#aaa"
/>

<RadioButton
android:id="@+id/radioNearBy"
android:layout_
android:layout_
android:gravity="center_horizontal|center_vertical"
android:text="@string/NearBy"
android:layout_weight="1"
android:button="@null"
android:background="@drawable/shape_radiobutton3"
android:layout_marginBottom="4dp"
android:layout_marginTop="4dp"
android:layout_marginRight="4dp"
android:textColor="@drawable/textcolor_radiobutton"
/>

</RadioGroup>

</LinearLayout>
<!-- For Horizontal Line-->
<View
android:layout_
android:layout_
android:layout_marginLeft="4dip"
android:layout_marginRight="4dip"
android:background="#aaa"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:map="http://schemas.android.com/apk/res-auto"
android:id="@+id/map"
android:layout_
android:layout_
android:layout_weight="1"
android:scrollbars="vertical"  
class="com.google.android.gms.maps.SupportMapFragment"/>
</RelativeLayout>

【问题讨论】：

@JoxTraex：添加了我尝试的布局代码以实现所需的输出

FrameLayout 是关键！

【参考方案1】：

也许更简单的解决方案是使用FrameLayout 或RelativeLayout 在地图前面设置一个叠加层，并将它们视为活动中的常规按钮。您应该以从后到前的顺序声明您的图层，例如，在按钮之前映射。我修改了你的布局，简化了一点。尝试以下布局，看看它是否适合您：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_
    android:layout_
    tools:context=".MapActivity" >

    <fragment xmlns:map="http://schemas.android.com/apk/res-auto"
        android:id="@+id/map"
        android:layout_
        android:layout_
        android:layout_weight="1"
        android:scrollbars="vertical"  
        class="com.google.android.gms.maps.SupportMapFragment"/>

    <RadioGroup 
        android:id="@+id/radio_group_list_selector"
        android:layout_
        android:layout_
        android:orientation="horizontal" 
        android:background="#80000000"
        android:padding="4dp" >

        <RadioButton
            android:id="@+id/radioPopular"
            android:layout_
            android:layout_
            android:text="@string/Popular"
            android:gravity="center_horizontal|center_vertical"
            android:layout_weight="1"
            android:background="@drawable/shape_radiobutton"
            android:textColor="@color/textcolor_radiobutton" />
        <View
            android:id="@+id/VerticalLine"
            android:layout_
            android:layout_
            android:background="#aaa" />

        <RadioButton
            android:id="@+id/radioAZ"
            android:layout_
            android:layout_
            android:gravity="center_horizontal|center_vertical"
            android:text="@string/AZ"
            android:layout_weight="1"
            android:background="@drawable/shape_radiobutton2"
            android:textColor="@color/textcolor_radiobutton" />

        <View
            android:id="@+id/VerticalLine"
            android:layout_
            android:layout_
            android:background="#aaa" />

        <RadioButton
            android:id="@+id/radioCategory"
            android:layout_
            android:layout_
            android:gravity="center_horizontal|center_vertical"
            android:text="@string/Category"
            android:layout_weight="1"
            android:background="@drawable/shape_radiobutton2"
            android:textColor="@color/textcolor_radiobutton" />
        <View
            android:id="@+id/VerticalLine"
            android:layout_
            android:layout_
            android:background="#aaa" />

        <RadioButton
            android:id="@+id/radioNearBy"
            android:layout_
            android:layout_
            android:gravity="center_horizontal|center_vertical"
            android:text="@string/NearBy"
            android:layout_weight="1"
            android:background="@drawable/shape_radiobutton3"
            android:textColor="@color/textcolor_radiobutton" />
    </RadioGroup>
</FrameLayout>

【讨论】：

@de Almeida：正是我想要的。谢谢伟大的帮助好友。希望有一天我能像你帮助我一样帮助你

它隐藏了一个 gps 位置符号（当我们点击它时，我们将相机聚焦到我们的 gps 位置）并且不知何故 gps 位置（蓝点）在地图视图中丢失了..

@sandeep：MapView 不会与您的 GPS 交互。它只是一张地图。如果您想创建导航功能，您必须自己捕获 GPS 位置并创建按钮、标记和功能。 MapView 将尽其所能提供一些放大和移动地图的方法，例如animateCamera(CameraUpdate update)。更多信息developers.google.com/maps/documentation/android/reference/com/…

de Almeida：非常感谢您的信息！ :) .由于我是新手，不知道细节。

这对我不起作用。我在xmlns:map="http://schemas.android.com/apk/res-auto" 上收到Attribute is missing the Android namespace prefix

【参考方案2】：

如果这是您想要的...只需在 Fragment 中添加按钮。

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/map"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    android:layout_
    android:layout_
    tools:context="com.example.LocationChooser">


    <Button
        android:layout_
        android:layout_
        android:layout_gravity="right|top"
        android:text="Demo Button" 
        android:padding="10dp"
        android:layout_marginTop="20dp"
        android:paddingRight="10dp"/>

</fragment>

【讨论】：

这对我有用！这有什么不好的做法吗？

添加 的结束标记将完成此示例。否则你会得到“解析 XML 时出错：找不到元素”。谢谢你的例子。

当我在地图片段中放置一个按钮标签时，我的 xml 设计视图中出现了渲染问题，并且它没有显示我的设计视图。怎么样？

@katwal-Dipak 如果我们在 java 代码中添加片段并在 xml 中添加按钮怎么办？

谢谢！但是在您的示例中，您缺少此代码 android:textStyle="bold" android:textColor="#808080" android:alpha="0.5"

【参考方案3】：

扩展 de Almeida 的回答我在这里稍微编辑代码。 由于之前的代码隐藏了 gps 位置图标，因此我按照效果更好的方式进行了操作。

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:orientation="vertical"

>

<RadioGroup 
    android:id="@+id/radio_group_list_selector"
    android:layout_
    android:layout_
    android:orientation="horizontal" 
    android:background="#80000000"
    android:padding="4dp" >

    <RadioButton
        android:id="@+id/radioPopular"
        android:layout_
        android:layout_
        android:text="@string/Popular"
        android:gravity="center_horizontal|center_vertical"
        android:layout_weight="1"
        android:button="@null"
        android:background="@drawable/shape_radiobutton"
        android:textColor="@drawable/textcolor_radiobutton" />
    <View
        android:id="@+id/VerticalLine"
        android:layout_
        android:layout_
        android:background="#aaa" />

    <RadioButton
        android:id="@+id/radioAZ"
        android:layout_
        android:layout_
        android:gravity="center_horizontal|center_vertical"
        android:text="@string/AZ"
        android:layout_weight="1"
        android:button="@null"
        android:background="@drawable/shape_radiobutton2"
        android:textColor="@drawable/textcolor_radiobutton" />

    <View
        android:id="@+id/VerticalLine"
        android:layout_
        android:layout_
        android:background="#aaa" />

    <RadioButton
        android:id="@+id/radioCategory"
        android:layout_
        android:layout_
        android:gravity="center_horizontal|center_vertical"
        android:text="@string/Category"
        android:layout_weight="1"
        android:button="@null"
        android:background="@drawable/shape_radiobutton2"
        android:textColor="@drawable/textcolor_radiobutton" />
    <View
        android:id="@+id/VerticalLine"
        android:layout_
        android:layout_
        android:background="#aaa" />

    <RadioButton
        android:id="@+id/radioNearBy"
        android:layout_
        android:layout_
        android:gravity="center_horizontal|center_vertical"
        android:text="@string/NearBy"
        android:layout_weight="1"
        android:button="@null"
        android:background="@drawable/shape_radiobutton3"
        android:textColor="@drawable/textcolor_radiobutton" />
</RadioGroup>

<fragment
    xmlns:map="http://schemas.android.com/apk/res-auto"
    android:id="@+id/map"
    android:layout_
    android:layout_
    class="com.google.android.gms.maps.SupportMapFragment"
    android:scrollbars="vertical" />

【讨论】：

嗨，我知道已经很晚了。我猜 API 发生了一些变化。运行上面的代码时，它显示“没有找到类”com.google.android.android.gms.maps.SupportMapFragment”错误。我在 MapsActivity.java 中导入了包。但我仍然无法修复它。需要您的帮助。

【参考方案4】：

您可以使用以下代码将按钮更改为左侧。

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:map="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/map"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    android:layout_
    android:layout_
    tools:context="com.zakasoft.mymap.MapsActivity" >

    <Button
        android:layout_
        android:layout_
        android:layout_gravity="left|top"
        android:text="Send"
        android:padding="10dp"
        android:layout_marginTop="20dp"
        android:paddingRight="10dp"/>

</fragment>