【问题标题】:Center elements of HorizontalScrollView when not enough to make it scroll水平滚动视图的中心元素不足以使其滚动
【发布时间】:2012-04-08 08:00:46
【问题描述】:

我有一个带有HorizontalScrollView 的布局,其中包含一个LinearLayout 的菜单,其中内容与数据库的内容一起膨胀。这可以正常工作,但是当没有足够的元素使HSV 滚动时,这不会填充理想情况下应该居中的屏幕宽度。 IE。 目前:

| Element 1 Element 2                         | <- edge of screen

代替:

|        Element 1            Element 2       | <- edge of screen

虽然仍然能够:

| Element 1 Element 2 Element 3 Element 4 Elem| <- edge of screen now scrolling

布局 XML 是:

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

    <TextView 
         android:id="@+id/header"
         android:layout_width="fill_parent"
         android:layout_height="25dp" >
    </TextView>

    <ScrollView
         android:id="@+id/scroll1"
         android:layout_width="fill_parent"
         android:layout_height="fill_parent"
         android:layout_weight="1" >

        <LinearLayout
             android:id="@+id/contentLayout"
             android:layout_width="fill_parent"
             android:layout_height="wrap_content"
             android:orientation="vertical" >

        </LinearLayout>
    </ScrollView>

    <HorizontalScrollView
        android:id="@+id/horizontalScrollView1"
        android:layout_width="fill_parent"
        android:layout_height="30dp">

        <LinearLayout
            android:id="@+id/footerLayout"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="horizontal" >

        </LinearLayout>
   </HorizontalScrollView>
</LinearLayout>

在 footerLayout 中扩展以下 XML:

<?xml version="1.0" encoding="utf-8"?>

        <TextView
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/footer_content"
            android:textSize="18sp"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:paddingLeft="5dp"
            android:paddingRight="5dp"
            android:text="FOOTER"
            android:singleLine="true" />

【问题讨论】:

    标签: android layout element center horizontalscrollview


    【解决方案1】:

    我刚刚解决了这个问题。几个小时前我遇到了它。您需要将 Horizo​​ntalScrollView 在其父级中居中并将其宽度/高度设置为 wrap_content。您放入 HSV 的布局也必须设置其宽度/高度以包装内容。这里重要的部分是不要在此布局上设置任何重力/布局重力,否则您可能会在膨胀视图后遇到(非常烦人的)剪辑问题。下面的示例包含在 RelativeLayout 中。

     <HorizontalScrollView  android:id="@+id/svExample"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/rlExample">
        <LinearLayout
            android:id="@+id/llExample"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="horizontal">
        </LinearLayout>
    </HorizontalScrollView >
    

    【讨论】:

    • 对我来说它工作正常的属性: android: layout_centerHorizo​​ntal = "true" android: layout_width = "wrap_content"
    【解决方案2】:

    我遇到了同样的问题,终于让它工作了。这是一个最小的例子:

    Horizo​​ntalScrollView 的主要活动布局:

    <?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">
    
        <HorizontalScrollView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:fillViewport="true" >
    
            <LinearLayout
                android:id="@+id/container"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal" >
            </LinearLayout>
    
        </HorizontalScrollView>
    
    </LinearLayout>
    

    将被膨胀并放入滚动视图中的元素的布局:

    <?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:gravity="center_horizontal"
        android:orientation="horizontal" >
    
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="your text" />
    
    </LinearLayout>
    

    这是一个膨胀和添加元素的代码示例:

    LinearLayout container = (LinearLayout) findViewById(R.id.container);
    LayoutParams elementLayoutParams = new LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT, 1f);
    int elementCount = 3; // ...or however many you like
    for (int i = 0; i < elementCount; i++) {
        LinearLayout element = (LinearLayout) getLayoutInflater().inflate(R.layout.element, null);
        container.addView(element, elementLayoutParams);
    }
    

    它主要基于this article by Romain Guy中解释的一种用于拉伸ScrollViews内容的技术。

    但是,在这种动态添加内容的情况下,另一个关键点是在将元素添加到容器时使用 LayoutParams 设置权重的正值(本例中为 1f)。如果您有一组可以直接包含在容器中且不需要膨胀的静态元素,您可以在 XML 布局中指定元素的外部 LinearLayout 的权重,如下所示:

    android:layout_weight="1"
    

    但是如果你动态地这样做,那将不起作用,因为权重将重置为 0 并且元素会崩溃。因此,您需要通过 LayoutParams 进行设置。

    【讨论】:

    • fillViewport="true" 是我正在寻找解决类似问题的缺失部分。对于未来的读者:如果您在 HorizontalScrollView 内的居中 TextView 遇到非常奇怪的左侧剪裁,请尝试使用 fillViewport 属性进行调整。它允许打开权重。
    • Romain Guy 的文章对我帮助很大
    【解决方案3】:

    以下是对我来说最简单的方法。

    <HorizontalScrollView
        android:id="@+id/horizontalScrollView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" 
        android:layout_gravity="center">
    
        <LinearLayout
            android:id="@+id/layout_others"
            android:orientation="horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"/>
    </HorizontalScrollView>
    

    【讨论】:

    • 这太棒了!
    【解决方案4】:

    设法绕过中心水平修剪左侧:

    Horizo​​ntalScrollView 部分布局改为:

    <LinearLayout 
        android:id="@+id/footerWrapperLayoutToGetAroundCenteringIssue"
        android:orientation="horizontal" 
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:gravity="center_horizontal">
    
        <HorizontalScrollView 
            android:id="@+id/horizontalScrollView1"
            android:layout_height="fill_parent" 
            android:layout_width="wrap_content">
            <LinearLayout 
                android:id="@+id/footerLayout" 
                android:orientation="horizontal" 
                android:layout_width="fill_parent" 
                android:layout_height="fill_parent">
            </LinearLayout>
        </HorizontalScrollView>
    </LinearLayout>
    

    遗憾的是,当它们居中时,它们分布不均匀。

    如果有人有任何想法,请告诉我。

    【讨论】:

      【解决方案5】:

      在膨胀视图中将 wieght 1 分配给 textview 并设置宽度 wrapcontent

      【讨论】:

      • 没有效果,还是一样
      • 如果内部只有一个或两个元素,LinearLayout footerLayout 似乎不会扩展以填充整个宽度。
      • 再尝试一件事可能会起作用,将您的代码中的线性布局分配给您插入的任何数量的元素,并将 xml 中的 wieght 1 分配给要膨胀的 textView。
      【解决方案6】:

      如果父布局是约束布局:

      <HorizontalScrollView
              app:layout_constraintTop_toTopOf="parent"
              app:layout_constraintHorizontal_bias="0.5"
              app:layout_constraintLeft_toLeftOf="parent"
              app:layout_constraintRight_toRightOf="parent"
              android:layout_width="wrap_content"
              android:layout_height="0dp">
              <LinearLayout
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:orientation="horizontal">
                  .
                  .
              </LinearLayout>
          </HorizontalScrollView>
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2014-01-03
        相关资源
        最近更新 更多