把ImageView放到控件右上角并超出控件的两种实现方式

把ImageView放到控件右上角并超出控件的两种实现方式

效果图

一安卓交流群里有个程序猿放出这样一张图，问怎么按钮放到图示里的位置，群里七嘴八舌的说了几种办法，但实现起来比较麻烦，于是我就向他分享了我的想法，实现起来也相当简单，于是就分享给大家

公司要求图片



楼主实现效果图

方法一，使用RelativeLayout布局加layout_margin属性

关键思想，

先添加一个RelativeLayout作为根布局，把imageview放到RelativeLayout右上角，

添加一个控件，宽高都设置为match_parent，并设置layout_margin属性为图像宽的一般效果就达到我们想要的效果了，代码如下

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="25dp">

<LinearLayout
android:layout_margin="15dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#6fea57"></LinearLayout>

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@mipmap/common_input_edit_clear_pressed" />
<ImageView
android:layout_alignParentRight="true"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@mipmap/common_input_edit_clear_pressed" />
<ImageView
android:layout_alignParentBottom="true"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@mipmap/common_input_edit_clear_pressed" />
<ImageView
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@mipmap/common_input_edit_clear_pressed" />

</RelativeLayout>

第二种，自定义viewgroup

看到第一种如此简单，第二种我都不想写了，但还是写一下，可以开阔一下思想，核心思想如下

自定义控件继承FrameLayout,

public class RightTopView extends FrameLayout

在onmeasure里面测量控件的大小和子控件的大小

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
if (getChildCount()!=2){
throw new IllegalStateException("you should have two child ,你必须拥有两个子控件");
}
//测量总控件的宽和高
width = getMeasuredWidth();
height = getMeasuredHeight();
//测量第二个子控件的宽和高
childWidth = getChildAt(1).getMeasuredWidth();
childHeight =getChildAt(1).getMeasuredHeight();

}

在onlayout方法中分布设置两个控件的位置

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
//对控件进行位置布局
getChildAt(0).layout(childWidth/2,childHeight/2,width-childWidth/2,height-childHeight/2);
getChildAt(1).layout(width-childWidth,0,width,childHeight);
}

在布局文件中使用，并把想要放在左上角的控件设置为第二个子控件即可

<com.example.csdn.view.RightTopView
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#ed9999"></LinearLayout>

<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="@mipmap/common_input_edit_clear_pressed" />
</com.example.csdn.view.RightTopView>

下面附上自定义控件的代码

package com.example.csdn.view;

import android.content.Context;
import android.util.AttributeSet;
import android.widget.FrameLayout;

/**
* Created by 玉光 on 2016-8-18.
*/
public class RightTopView extends FrameLayout {

private int width;
private int height;
private int childWidth;
private int childHeight;

public RightTopView(Context context) {
super(context);
}

public RightTopView(Context context, AttributeSet attrs) {
super(context, attrs);
}

public RightTopView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
if (getChildCount()!=2){
throw new IllegalStateException("you should have two child ,你必须拥有两个子控件");
}
//测量总控件的宽和高
width = getMeasuredWidth();
height = getMeasuredHeight();
//测量第二个子控件的宽和高
childWidth = getChildAt(1).getMeasuredWidth();
childHeight =getChildAt(1).getMeasuredHeight();

}

@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
//对控件进行位置布局
getChildAt(0).layout(childWidth/2,childHeight/2,width-childWidth/2,height-childHeight/2);
getChildAt(1).layout(width-childWidth,0,width,childHeight);
}
}

作者有时间的时候会帮同行们实现一些网上不容易找到效果，如果你也需要帮助，不妨私信一下作者，欢迎大家一起交流和进步！