自定义方形线性布局。如何?

Posted

技术标签:

【中文标题】自定义方形线性布局。如何?【英文标题】:Custom Square LinearLayout. How? 【发布时间】:2013-05-25 09:19:48 【问题描述】:

我为方形布局创建了自己的类:

public class SquareLayout extends LinearLayout

    public SquareLayout(Context context) 
        super(context);
    

    public SquareLayout(Context context, AttributeSet attrs, int defStyle) 
        super(context, attrs, defStyle);
    

    public SquareLayout(Context context, AttributeSet attrs) 
        super(context, attrs);
    


    @Override public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 
        int width = MeasureSpec.getSize(widthMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);
        int size = width > height ? height : width;
        setMeasuredDimension(size, size);
    

然后,在我的 xml 中:

...
        <com.myApp.SquareLayout
            android:layout_
            android:layout_
            android:layout_gravity="center_horizontal"
            android:orientation="horizontal" >

            <ImageView
                android:id="@+id/cellImageView"
                android:adjustViewBounds="true"
                android:layout_
                android:layout_
                android:layout_marginTop="2dp"
                android:padding="2dp"
                android:scaleType="centerCrop"
                android:src="@drawable/image" />
        </com.myApp.SquareLayout>
...

在我的 java 代码中没有写更多的东西。 但是,如果我的布局和图像,我只看到一个白色矩形......

我错了什么?

【问题讨论】:

开始标签 - &lt;com.myApp.SquareLayout - 结束标签 - &lt;/it.appdroid.muze.SquareLayout&gt; ??? 【参考方案1】:

// 你忘记调用 super.onMeasure(widthMeasureSpec, widthMeasureSpec);

@Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 

    super.onMeasure(widthMeasureSpec, widthMeasureSpec);
    int width = MeasureSpec.getSize(widthMeasureSpec);
    int height = MeasureSpec.getSize(heightMeasureSpec);
    int size = width > height ? height : width;
    setMeasuredDimension(size, size);


//xml文件

<com.example.testapplication.SquareLayout
    android:id="@+id/layout"
    android:layout_
    android:layout_
    android:layout_gravity="center_horizontal"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/cellImageView"
        android:layout_
        android:layout_
        android:layout_marginTop="2dp"
        android:adjustViewBounds="true"
        android:padding="2dp"
        android:scaleType="centerCrop"
        android:src="@drawable/ic_launcher" />

  </com.example.testapplication.SquareLayout> 

【讨论】:

com.example.testapplication.SquareLayout 是 SquareLayout 文件的完全限定路径 警告:这不适用于 RelativeLayout 作为基类。我正试图做到这一点,但是基类为RelativeLayout,而子类为centerInParent,并且没有适当地重新布置子类。使用 LinearLayout 代替,它可以完美运行。【参考方案2】:

在将相同的技术应用于RelativeLayout 时,我直接调用setMeasuredDimension 时遇到问题。我无法正确对齐底部边缘。改为使用新的度量规范调用 super.onMeasure() 效果更好。

  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 
    int width = MeasureSpec.getSize(widthMeasureSpec);
    int height = MeasureSpec.getSize(heightMeasureSpec);
    int size = Math.min(width, height);
    super.onMeasure(MeasureSpec.makeMeasureSpec(size, MeasureSpec.EXACTLY),
        MeasureSpec.makeMeasureSpec(size, MeasureSpec.EXACTLY));
  

【讨论】:

这是一个比公认的答案更灵活的解决方案,因为它可以与除 LinearLayout 之外的许多不同超类一起使用。 所有可用的答案都相似,但在测量儿童的体型方面存在问题,这是正确的答案,非常感谢。【参考方案3】:

编辑:

以下解决方案现已弃用,因为 ConstraintLayout 已成为新标准并提供此功能。

原答案:

原来安卓团队给了我们解决方案,但没人知道!从Percent Support Library查看这两个类:

PercentFrameLayout PercentRelativeLayout

如果你想强加一个视图的比例,你必须把它放在这些布局之一中。因此,在这种情况下,您必须将标准的LinearLayout,而不是您的子类,放置在具有正确纵横比的这些布局之一中。例如,如果你想使用 PercentFrameLayout:

<android.support.percent.PercentFrameLayout
         xmlns:android="http://schemas.android.com/apk/res/android"
         xmlns:app="http://schemas.android.com/apk/res-auto"
         android:layout_
         android:layout_>
     <LinearLayout
         android:layout_
         android:layout_
         app:layout_aspectRatio="100%">
         <!-- Whatever subviews you want here -->
     </LinearLayout>
 </android.support.percent.PercentFrameLayout>

然后,您的所有视图都将包含在一个方形线性中 布局!

不要忘记添加gradle依赖compile 'com.android.support:percent:23.3.0'根据需要调整版本号

【讨论】:

纵横比似乎不起作用,除非仅定义宽度或高度并且定义为固定数字(而不是 match_parent)。使用com.android.support:percent:25.0.1 PercentFrameLayout 和 PercentRelativeLayout 现在都已弃用。建议改用 ConstraintLayout。 使用jetpack库实现“androidx.percentlayout:percentlayout:1.0.0”

以上是关于自定义方形线性布局。如何?的主要内容,如果未能解决你的问题,请参考以下文章

使用UICollectionView自定义样式01-水平线性布局

让自定义列表适配器正确膨胀多个线性布局

详细分享UICollectionView的自定义布局(瀑布流, 线性, 圆形...)

线性布局android中的重叠视图

Flutter控件——布局控件:线性

第四章: 布局类组件 4.3 线性布局(Row和Column)