android - RelativeLayout align parent bottom 在底部不对齐

Question

我有一个使用相对布局的自定义圆形布局:

public class CircularLayout extends RelativeLayout implements OnDragListener {
    private DropCallback onDrop = null;
    private ImageButton imageButton = null;
    private ImageView imageViewBackgroundWave = null;
    private int radius = -1;
    private double step = -1;
    private double angle = -1;
    private static final int CENTER_ID = 111;

    public CircularLayout(Context context, DropCallback onDrop, int radius, List<View> views) {
        super(context);

        this.onDrop = onDrop;
        this.radius = radius;
        this.step = (2 * Math.PI) / views.size();

        this.initView(context, views);
    }

    private void initView(Context context, List<View> views) {
        RelativeLayout.LayoutParams layoutParamsView = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);

        this.setLayoutParams(layoutParamsView);

        RelativeLayout.LayoutParams layoutParamsImageview = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
        layoutParamsImageview.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
        layoutParamsImageview.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);

        this.imageViewBackgroundWave = new ImageView(this.getContext());
        this.imageViewBackgroundWave.setLayoutParams(layoutParamsImageview);
        this.imageViewBackgroundWave.setImageDrawable(this.getResources().getDrawable(R.drawable.background_wave));

        this.addView(this.imageViewBackgroundWave);

        RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
        layoutParams.addRule(RelativeLayout.CENTER_HORIZONTAL);
        layoutParams.addRule(RelativeLayout.CENTER_VERTICAL);

        this.imageButton = new ImageButton(context);
        this.imageButton.setId(CENTER_ID);
        this.imageButton.setLayoutParams(layoutParams);
        this.imageButton.setImageResource(R.drawable.ic_power_on);
        this.imageButton.getBackground().setAlpha(0);
        this.imageButton.setOnDragListener(this);

        this.addView(this.imageButton);

        for(View view : views) {
            this.addView(this.placeView(view));
        }
    }

    private View placeView(View view) {
        view.measure(0, 0);
        this.imageButton.measure(0, 0);

        int x = (int)((view.getMeasuredWidth() / 2) + this.radius * Math.cos(this.angle));
        int y = (int)((view.getMeasuredHeight() / 2) + this.radius * Math.sin(this.angle));

        this.angle += this.step;

        int deltaX = view.getMeasuredWidth();
        int deltaY = view.getMeasuredHeight();
        int deltaImageX = this.imageButton.getMeasuredWidth() / 2;
        int deltaImageY = this.imageButton.getMeasuredHeight() / 2;
        int xToDraw = ((x - deltaX) - deltaImageX);
        int yToDraw = ((y - deltaY) - deltaImageY);

        RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
        layoutParams.addRule(RelativeLayout.ABOVE, CENTER_ID);
        layoutParams.addRule(RelativeLayout.RIGHT_OF, CENTER_ID);
        layoutParams.setMargins(xToDraw, 0, 0, yToDraw);

        view.setLayoutParams(layoutParams);

        return view;
    }

    @Override
    public boolean onDrag(View view, DragEvent event) {
        return this.onDrop.onDrop(view, event);
    }
}

不幸的是，imageview (imageViewBackgroundWave) 没有在底部对齐。它对齐得高一点:

所以问题是:如何将 ImageView 与屏幕底部对齐？图像与蓝色条纹一样高和一样宽。没有填充或白色。就是上图中的蓝色条纹。

编辑:

background_wave.png:

我在我的 MenuFragment 中使用了这个自定义布局，并使用以下代码调用它:

    @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    // ... init the imagebuttons in the list of views

    this.circleView = new CircularLayout(this.getActivity(), this, 250, views);
    this.circleView.setOnDragListener(this);
    this.circleView.setBackground(this.getResources().getDrawable(R.drawable.background));

    return this.circleView;
}

Answer 1

您可以通过添加以下代码行让 ImageView 固定在底部:

imageView.setScaleType(ScaleType.FIT_END);

奇怪的原因是 ImageView 边界首先由布局引擎计算，然后ImageView 内的图像根据缩放类型缩放以适合分配的区域。

为 ImageView 使用 WRAP_CONTENT 会根据未缩放图像位图的大小分配一个区域 - 即使它比屏幕大。您的 background_wave.png 文件比屏幕宽，因此分配的区域比需要的区域大。然后，当使用 FIT_CENTER 将图像放入布局区域内时，它会缩小并居中，因此最终会在其上方和下方出现空白。

您可以通过将 background_wave.png 大小调整为 1/4 来验证这一点:即使没有更改上述代码，它也应该对齐底部。