17

所以我有两个不同Drawables的,我需要在运行时合并并得到一个Drawable。我希望第一个Drawable在顶部,另一个在底部。我遇到了LayerDrawable,它看起来正是我需要的,但我在尝试安排Drawables.

所以我有一个ImageButton48x48 的尺寸dp,这就是决赛Drawable的去向。第一个Drawable是加号按钮 (20x20 dp),第二个是dp加号按钮下方的一个小点 (4x4 )。

加号按钮Drawable是使用字体字形加载的。我正在Drawable使用这个 xml 片段创建点按钮:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
       android:shape="oval">
    <solid
        android:color="@color/white_40"/>
    <size
        android:width="4dp"
        android:height="4dp"/>
</shape>

我的第一种方法是将两者都添加Drawables到 中LayerDrawable,但是当我这样做时,xml 中指定的点的宽度/高度属性将被忽略,并且它会延伸以覆盖加号图标。

LayerDrawable finalDrawable = new LayerDrawable(new Drawable[] {plusIcon, dotIcon});

上面的结果是:



我尝试的第二种方法是使用setLayerInsetto try and position the two Drawables.

    LayerDrawable finalDrawable = new LayerDrawable(new Drawable[] {plusIcon, dotIcon});
    finalDrawable.setLayerInset(0, 0, 0, 0, 0);
    finalDrawable.setLayerInset(1, dp(22), dp(44), dp(22), 0);

上面的代码片段最终将点放置在正确的位置,但它也开始影响加号按钮的位置和大小,最终看起来像这样:
在此处输入图像描述

但我真正想要的是在中间有加号按钮,在ImageButton它下面有加号图标。有谁知道我哪里出错了,我怎样才能正确定位两个drawable?

PS:我的应用程序支持 API 15+,所以我不能使用来自LayerDrawableAPI 的一堆方法,比如setLayerGravity`setPaddingMode 等。

4

2 回答 2

20

编辑

此代码适用于低于 23 的 API 级别:

ImageButton button = (ImageButton) findViewById(R.id.button);

Drawable plusIcon = ContextCompat.getDrawable(this, R.drawable.plus);
Drawable dotIcon = ContextCompat.getDrawable(this, R.drawable.oval);

int horizontalInset = (plusIcon.getIntrinsicWidth() - dotIcon.getIntrinsicWidth()) / 2;

LayerDrawable finalDrawable = new LayerDrawable(new Drawable[] {plusIcon, dotIcon});
finalDrawable.setLayerInset(0, 0, 0, 0, dotIcon.getIntrinsicHeight());
finalDrawable.setLayerInset(1, horizontalInset, plusIcon.getIntrinsicHeight(), horizontalInset, 0);

button.setImageDrawable(finalDrawable);

原来的

以下代码适用于我:

ImageButton button = (ImageButton) findViewById(R.id.button);

Drawable plusIcon = ContextCompat.getDrawable(this, R.drawable.plus);
Drawable dotIcon = ContextCompat.getDrawable(this, R.drawable.oval);

LayerDrawable finalDrawable = new LayerDrawable(new Drawable[] {plusIcon, dotIcon});
finalDrawable.setLayerInsetBottom(0, dotIcon.getIntrinsicHeight());
finalDrawable.setLayerGravity(1, Gravity.BOTTOM | Gravity.CENTER_HORIZONTAL);

button.setImageDrawable(finalDrawable);

这会产生以下用户界面:

在此处输入图像描述

于 2017-07-17T21:02:47.487 回答
0

这就是我解决这个问题的方法:

final View view = findViewById(R.id.view_in_layout);

Drawable bottom = ContextCompat.getDrawable(context, R.drawable.ic_bottom);
Drawable top = ContextCompat.getDrawable(context, R.drawable.ic_top);

//bottom = index 0, top = index 1
final LayerDrawable layer = new LayerDrawable(new Drawable[]{bottom, top});

view.addOnLayoutChangeListener(new View.OnLayoutChangeListener() {
    @Override
    public void onLayoutChange(View v, int left, int top, int right, int bottom,
                  int oldLeft, int oldTop, int oldRight, int oldBottom) {
        //get the real height after it is calculated
        int height = view.getHeight();
        //set the height half of the available space for example purposes,
        //the drawables will have half of the available height
        int halfHeight = height / 2;
        //the bottom drawable need to start when the top drawable ends
        layer.setLayerInset(0, 0, halfHeight, 0, 0);
        //the top drawable need to end before the bottom drawable starts
        layer.setLayerInset(1, 0, 0, 0, halfHeight);

        view.setBackground(layer);
        view.removeOnLayoutChangeListener(this);
    }
});

您可以为您的可绘制对象选择不同的尺寸或使用索引移动它们。例如,我用来View.OnLayoutChangeListener(...)等待视图的当前可用高度

于 2017-07-17T21:27:21.883 回答