我有两个水平滚动视图。 如何一次显示一个，并在单击按钮时在它们之间切换？

Question

On my android app I have two horizontal scroll views that act as docks. How can I make it so that if button 1 is clicked dock 1 displays and if button 2 is clicked dock 2 displays? Since they're docks I want them to both display in the same position.

here is my code:

<HorizontalScrollView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button1" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button2" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button3" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button4" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button5" />
        </LinearLayout>

    </HorizontalScrollView>

    <HorizontalScrollView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button4" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button5" />
    </LinearLayout>

                <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="dockButton1" />

               <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="dockButton2" />

Button code:

dock1button.setOnClickListener(new View.OnClickListener() {

   @Override
   public void onClick(View view) {

   }
});

dock2button.setOnClickListener(new View.OnClickListener() {

   @Override
   public void onClick(View view) {

   }
});

Answer 1

Step 1: add id in both of the HorizontalScrollView for example: android:id="@+id/hScrollView1" and android:id="@+id/hScrollView2"

Step 2: Put both HorizontalScrollView in a parent LinearLayout like below:

    <LinearLayout>
    <HorizontalScrollView
     android:id="@+id/hScrollView1">
    .
    .         
    </HorizontalScrollView>
    <HorizontalScrollView
     android:id="@+id/hScrollView2">
    .
    .
    </HorizontalScrollView>
    </LinearLayout>

Step 3: In your button click just toggle the visibility: in onClick just use..

hScrlView1.setVisibility(View.GONE);
hScrlView2.setVisibility(View.VISIBLE);

and

hScrlView1.setVisibility(View.VISIBLE);
hScrlView2.setVisibility(View.GONE);

where hScrlView1 and hScrlView2 are the ScrollView you want to show.

Answer 2

put the two horizontal listviews in a relative layout and set the visibility of one of them to invisible.

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

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <HorizontalScrollView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button1" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button2" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button3" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button4" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button5" />
        </LinearLayout>
    </HorizontalScrollView>

    <HorizontalScrollView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:visibility="invisible" >

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button1" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button2" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button3" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button4" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Button5" />
        </LinearLayout>
    </HorizontalScrollView>

</RelativeLayout>


        <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="dockButton1" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="dockButton2" />

then change the visibility in buttons' codes:

Button code:

dock1button.setOnClickListener(new View.OnClickListener() {

  @Override
  public void onClick(View view) {
     horizontalList2.setVisibilty(View.INVISIBLE);
     horizontalList1.setVisibilty(View.VISIBLE);
  }
});

dock2button.setOnClickListener(new View.OnClickListener() { 
 @Override
 public void onClick(View view) { 
    horizontalList1.setVisibilty(View.INVISIBLE);
    horizontalList2.setVisibilty(View.VISIBLE);
 }
 });

Answer 3

You'd be better off by just using FrameLayout containing both scrollviews. It would be more performant than using LinearLayout or even worse RelativeLayout .

Just do something like this (schematic code, some xml attrs omitted)

<FrameLayout>
  <HorizontalScrollView
    android:id="@+id/view1"/>

  <HorizontalScrollView
    android:id="@+id/view2"
    android:visibility="gone"
  />
</FrameLayout>

And then in your onClick handler(s) do something like

view1.setVisibility(View.VISIBLE)
view2.setVisibility(View.GONE)

or vice versa (depending on button pressed)