Android - 制作包含ListView滚动条的LinearLayout

Question

我知道每个人的建议我们都不应该使用ListView和ScrollView，我完全同意。不过，我目前坚持使用一个非常简单的模式，如8tracks的个人资料页面（如下图所示），其中包括用户个人资料区域和他们制作的混合列表。所以基本上，这是希望用户只需向下滚动该页面，这意味着型材件将获得在屏幕的顶部，并逐步走出观点，并在同一时间的文章滚动太：

但是，目前，我所能做的就是在LinearLayout之内包含一个ListView，就像我在这里的草图。

采用这种设计，我只能滚动列表下降，而配置区停留在同一个地方，这吮吸。所以我正在寻找任何想法让整个页面滚动，而不仅仅是列表。请帮助和谢谢。

编辑：对于误导性问题，我很抱歉。我的问题更加复杂，因为选项卡的内容不仅仅是ListView - 某些选项卡包含LinearLayout或GridView。同样，我想要实现的目标是使整个页面可以滚动，但ScrollView不能提供帮助，因为如果选项卡的内容是ListView或GridView，这些视图将会崩溃，更重要的是 - 这违背了设计规则。

Answer 1

我知道这是晚了，但我对8tracks当前开发商。上面显示的（旧）2.x应用程序正在重写，但我可以向您展示旧开发人员为配置文件页面所做的工作。

再进，我必须说，这是不是这样做的最佳方式，但8tracks应用程序（2.X）是旧的。

所以回到代码... ProfileActivity包含一个ProfileFragment。

你关注按钮（和个人资料图片）看到的主要布局是这样的：

<?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" > 

    <!-- Image, name, location --> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal" 
     android:padding="10dip" > 

     <com.gdub.widget.ImageViewClickable 
      android:id="@+id/dj_avatar" 
      android:layout_width="110dip" 
      android:layout_height="110dip" 
      android:layout_marginRight="10dip" 
      android:background="@drawable/default_avatar_max200" 
      android:scaleType="centerCrop" /> 

     <com.gdub.widget.CollapsingTextView 
      android:id="@+id/dj_location" 
      style="@style/mix.counts" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginBottom="10dip" 
      android:layout_toRightOf="@id/dj_avatar" /> 

     <ViewSwitcher 
      android:id="@+id/profile_action_btn" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_below="@id/dj_location" 
      android:layout_toRightOf="@id/dj_avatar" > 

      <Button 
       android:id="@+id/follow_btn" 
       style="@style/white_button" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/follow" /> 

      <Button 
       android:id="@+id/edit_profile_btn" 
       style="@style/white_button" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/edit_profile" /> 
     </ViewSwitcher> 
    </RelativeLayout> 

    <TextView 
     android:id="@+id/dj_bio" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="-25dip" 
     android:gravity="left|center_vertical" 
     android:lineSpacingExtra="2dip" 
     android:paddingLeft="10dip" 
     android:paddingRight="10dip" 
     android:textColor="@color/default_text" 
     android:textSize="15sp" /> 

    <include 
     android:id="@+id/profile_tabs" 
     layout="@layout/profile_tabs" /> 

</LinearLayout> 

而且profile_tabs ...

<?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="wrap_content" 
    android:visibility="gone" 
    android:orientation="horizontal"> 

    <include 
     android:id="@+id/profile_mixes_button" 
     layout="@layout/profile_tab" /> 

    <include 
     android:id="@+id/profile_followers_button" 
     layout="@layout/profile_tab" /> 

    <include 
     android:id="@+id/profile_following_button" 
     layout="@layout/profile_tab" /> 

</LinearLayout> 

因此，大家可以看到这是一个常规的布局有三个按钮“模拟”选项卡。

的选项卡的内容也决定由ViewSwitcher：

<?xml version="1.0" encoding="utf-8"?> 
<ViewSwitcher xmlns:android="http://schemas.android.com/apk/res/android" 
       android:id="@+id/profile_view_switcher" 
       android:layout_width="match_parent" 
       android:layout_height="match_parent" 
       android:inAnimation="@anim/fade_in_300" 
       android:outAnimation="@anim/fade_out_300" 
       android:background="@color/white"> 

<include 
    android:id="@+id/profile_loading" 
    layout="@layout/loading_view_full" /> 

<ListView 
    android:id="@+id/profile_content_list" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:cacheColorHint="#00000000" 
    android:divider="@null" 
    android:dividerHeight="0dip" 
    android:fadingEdge="none" /> 

</ViewSwitcher> 

，显示了负重轮，然后切换到列表视图。没有其他可滚动的ViewGroup。

而这基本上它。

现在，如果您希望滚动WHOLE事物，那么您需要使用自定义适配器并将上述布局设置为标题（或至少在适配器中以巧妙的方式使用getItemType）。这样整个屏幕就是一个List（包含一个列表的所有优化）。

我们（AB）下开发新的应用程序8tracks使用此。 ;）

Answer 2

尝试在您的列表视图中使用以下内容。

listview.addHeaderView(v); 

还记得，你必须在你的listview调用setAdapter（）之前调用这个方法。

包含您的线性布局，您可以在其中获取用户详细信息和选项卡，并将其作为标题添加到列表中。

Answer 3

您可以尝试将配置文件和标签作为列表视图的标题，然后在按下标签时更新列表视图的内容。尽管如此，我不知道在滚动时是否希望标签从视图中消失。

Answer 4

根据UI指南和最佳实践，建议不要在Scrollview中使用Scrollable内容，并且这样做会妨碍Scrollable内容的滚动。

当你把两个滚动视图android只是感到困惑哪个滚动视图被触摸。所以有时它无法提供触摸事件。

但是，如果您仍希望实现滚动功能，则可以通过使用特定视图的onTouch事件来进行管理。你需要相应地设计你的布局。

但即使该要求迫使你做出这样的布局。试试这个...

说的情况有点像这样......。

<ScrollView android:id=”@+id/parent_scroll” 
     android:layout_width=”fill_parent” 
     android:layout_height=”wrap_content” 
     android:layout_weight=”1″ 
     android:background=”@drawable/dotted_bg” 
     android:focusableInTouchMode=”false”> 
        <LinearLayout /> 
        <LinearLayout /> 
        <LinearLayout > 
        <ScrollView android:id=”@+id/child_scroll” 
        android:layout_width=”fill_parent” 
        android:layout_height=”fill_parent” 
        android:background=”@drawable/text_box_bg”> 
       <TextView android:id=”@+id/text_description” 
        android:layout_width=”fill_parent” 
        android:layout_height=”fill_parent” 
        android:textColor=”@color/gray” 
        android:textSize=”12dip” 
        android:padding=”5dip” 
        android:scrollbars=”vertical”/> 
       <!–ScrollView> 
       </LinearLayout> 

步骤1：提供唯一的ID到两个滚动视图。

步骤2：把两个滚动视图在活动的参考。

parentScroll=(ScrollView)findViewById(R.id.parent_scroll); 
    childScroll=(ScrollView)findViewById(R.id.child_scroll); 

步骤3：现在设置触摸侦听器两者。

parentScroll.setOnTouchListener(new View.OnTouchListener() { 
      public boolean onTouch(View v, MotionEvent event) { 
       Log.v(TAG,”PARENT TOUCH”); 
    findViewById(R.id.child_scroll).getParent().requestDisallowInterceptTouchEvent(false); 
       return false; 
      } 
     }); 
     childScroll.setOnTouchListener(new View.OnTouchListener() { 
      public boolean onTouch(View v, MotionEvent event) 
      { 
       Log.v(TAG,”CHILD TOUCH”); 
            // Disallow the touch request for parent scroll on touch of child view 
       v.getParent().requestDisallowInterceptTouchEvent(true); 
       return false; 
      } 
     }); 

我希望这会帮助你。