android view放大被遮挡，我来解决

最新推荐文章于 2023-02-08 15:45:50 发布

铖snake

最新推荐文章于 2023-02-08 15:45:50 发布

阅读量3.1k

点赞数 3

本文链接：https://blog.csdn.net/a22422931/article/details/53300936

版权

工具类专栏收录该内容

16 篇文章 0 订阅

订阅专栏

首先先来说说这个问题出现时的样式吧（如图1）。因为在做android TV应用开发时，很经常用到在控件获取焦点时，采用控件放大的动画效果，来增加用户的聚焦和体验。这时大家就想到直接让焦点控件执行放大动画，不就可以吗。但是当你直接这个做得时候，一个大问题就来了（如图1），你会发现放大的控件可以覆盖左上的控件，但是会被右下的控件覆盖（前提是你所加入控件的顺序从左到右，从上到下的。本质是前加的控件放大后会被后加的控件覆盖）。

上段文字已经提出了问题，现在来分析一下这个问题。为什么会出现呢？以LinearLayout为例（RelativeLayout 大家不要着急，我在文章的后面会给出说明），线性布局在添加子View/子ViewGroup时，是按照添加的先后顺序进行加入的，这时当你放大（非最后一个控件）控件时，这个被放大控件的区域达到其他控件所占有的区域时，这个时候因为后加入的控件的Z轴值比放大控件的大，所以放大的控件会被后加入的控件所覆盖。反正比放大控件先加的控件Z轴值小，就不会覆盖放大控件。前面出现的Z轴，这里解释一下，我们看到的屏幕宽，高分别表示X，Y轴，和屏幕垂直轴称为Z轴。

现在到了解决问题的时候了。经过分析，我们发现跟Z轴值的大小有关，而且还发现Z轴的大小跟控件加入group的先后顺序是有关系的，先加入的小于后加入的。这时有些人就会想到View.bringToFront();这个方法，这个方法的意思是把view至于同级控件的最上方，但是不会超越父控件。该方法在某些简单的布局中，或者不需要刷新的布局中可以使用，并且也有效果。但是在稍微复杂的或者需要刷新的界面就会出现错乱的问题。既然有这样一个方法，虽然会出现问题，但是我们也要去看看这个方法为什么可以达到一定的效果。

代码分析：

在view中调用bringToFront，其实源码中的实现为

public void bringToFront() {
    if (mParent != null) {
        mParent.bringChildToFront(this);
    }
}

我们继续看方法

mParent.bringChildToFront(this);

/**
 * {@inheritDoc}
 */
public void bringChildToFront(View child) {
    //获取该调用的childView是父控件的第几子
    final int index = indexOfChild(child);
    if (index >= 0) {
        //在父控件的view数组中移除
        removeFromArray(index);
        //添加到父控件中view数组的最后面
        addInArray(child, mChildrenCount);
        child.mParent = this;
        requestLayout();
        //重新绘制， 这个时候就会按照父控件中的view数组重新绘制，这个时候child就变成最后绘制了。
        invalidate();
    }
}

看到这里，大家应该明白为什么当你调用View.bringToFront()方法时会有一定的效果了吧。

但是在复杂的UI或者UI需要经常刷新的时候，单单靠这个源生的方法是无法满足的，经过研究发现在viewgroup绘制子view的时候会调用方法

getChildDrawingOrder

大家可以看看getChildDrawingOrder这个方法的解释

/ **
      *返回要为此迭代绘制的子元素的索引。覆盖此
      *如果你想改变孩子的绘画顺序。默认情况下，它
      *返回i。
      * <p>
      *注意：为了调用此方法，您必须启用子订单
      *首先通过调用{@link #setChildrenDrawingOrderEnabled（boolean）}。
      *：
      * @param i当前迭代。
      * @return孩子的索引来绘制这个迭代。
      *：
      * @see #setChildrenDrawingOrderEnabled（boolean）
      * @see #isChildrenDrawingOrderEnabled（）
      * /

好了，看到这个方法我们就知道可以通过改变这个方法的返回值来修改绘制的顺序了（具体的有兴趣的读者可以去查看一下getChildDrawingOrder 方法在ViewGroup中的调用情况）。

好了，给大家分析了这个多，接着我就直接点上代码了，注释已经写好。有疑问的可以留言，必回。

代码结构：

package com.example.testviewbringtofront;

import android.view.View;
import android.view.ViewGroup;

public class ControlViewBringToFront {
private int mFocusChildIndex;

public ControlViewBringToFront(){

}

public ControlViewBringToFront(ViewGroup vg){
  //设置这个方法后，子view可以绘制在父控件的padding区域之上，否则绘制在padding区域之下
  vg.setClipChildren(false);
  vg.setClipToPadding(false);
}

public void bringChildToFront(ViewGroup viewGroup, View childView){
  mFocusChildIndex = viewGroup.indexOfChild(childView);
  if(mFocusChildIndex != -1){
   viewGroup.postInvalidate();
  }
}

/**
* 此函数 dispatchDraw 中调用. <br>
* 原理就是和最后一个要绘制的view，交换了位置. <br>
* 因为dispatchDraw最后一个绘制的view是在最上层的. <br>
* 这样就避免了使用 bringToFront 导致焦点错乱问题. <br>
*/
public int getChildDrawingOrder(int childCount, int i){
  if(mFocusChildIndex != -1){

   if(i == childCount-1){
    if(mFocusChildIndex > childCount-1){
     mFocusChildIndex = childCount-1;
    }
    return mFocusChildIndex;
   }

   if(i == mFocusChildIndex){

    return childCount -1;
   }

  }
  if(childCount <= i){
   i = childCount-1;
  }
  return i;
}

}

重写的ViewGroup，以LinearLayout 为例：

package com.example.testviewbringtofront.view;

import com.example.testviewbringtofront.ControlViewBringToFront;

import android.content.Context;
import android.util.AttributeSet;
import android.view.View;
import android.widget.LinearLayout;

public class MyLinearLayout extends LinearLayout{

private ControlViewBringToFront mControlViewBringToFront;

public MyLinearLayout(Context context, AttributeSet attrs) {
  super(context, attrs);
  // TODO Auto-generated constructor stub
  //getChildDrawingOrder方法要求这个方法要设置成true
  setChildrenDrawingOrderEnabled(true);
  mControlViewBringToFront = new ControlViewBringToFront(this);
}

@Override
protected int getChildDrawingOrder(int childCount, int i) {
  // TODO Auto-generated method stub
//  return super.getChildDrawingOrder(childCount, i);
  return mControlViewBringToFront.getChildDrawingOrder(childCount, i);
}

@Override
public void bringChildToFront(View child) {
  // TODO Auto-generated method stub
//  super.bringChildToFront(child);
  mControlViewBringToFront.bringChildToFront(this, child);
}

}

主类：

package com.example.testviewbringtofront;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnFocusChangeListener;
import android.widget.Button;

public class MainActivity extends Activity implements OnFocusChangeListener{

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  initView();
}

private void initView() {
  // TODO Auto-generated method stub
  Button button1 = (Button)findViewById(R.id.button1);
  Button button2 = (Button)findViewById(R.id.button2);
  Button button3 = (Button)findViewById(R.id.button3);
  Button button4 = (Button)findViewById(R.id.button4);
  Button button5 = (Button)findViewById(R.id.button5);
  Button button6 = (Button)findViewById(R.id.button6);
  Button button7 = (Button)findViewById(R.id.button7);
  Button button8 = (Button)findViewById(R.id.button8);
  Button button9 = (Button)findViewById(R.id.button9);
  button1.setOnFocusChangeListener(this);
  button2.setOnFocusChangeListener(this);
  button3.setOnFocusChangeListener(this);
  button4.setOnFocusChangeListener(this);
  button5.setOnFocusChangeListener(this);
  button6.setOnFocusChangeListener(this);
  button7.setOnFocusChangeListener(this);
  button8.setOnFocusChangeListener(this);
  button9.setOnFocusChangeListener(this);
}

@Override
public void onFocusChange(View v, boolean hasFocus) {
  // TODO Auto-generated method stub
  switch (v.getId()) {
  case R.id.button7:
  case R.id.button8:
  case R.id.button9:
   if(hasFocus){
    v.animate().scaleX(2.2f).scaleY(2.2f).setDuration(500).start();
//    v.bringToFront();
   }else{
    v.animate().scaleX(1.0f).scaleY(1.0f).setDuration(500).start();
   }
   break;

  default:
   if(hasFocus){
    v.animate().scaleX(2.2f).scaleY(2.2f).setDuration(500).start();
    v.bringToFront();
   }else{
    v.animate().scaleX(1.0f).scaleY(1.0f).setDuration(500).start();
   }
   break;
  }

}

}

使用到的布局文件XML：

    <com.example.testviewbringtofront.view.MyLinearLayout
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:gravity="center_vertical|center_horizontal"
        android:orientation="horizontal"
         >
  <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginRight="25dp"
      android:text="使用重写后的Layout,在调用bringToFront，执行放大动画"/>
        <Button
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginRight="15dp"
            android:background="@android:color/holo_red_light"
            android:text="Button1" />

</LinearLayout>

资源下载地址 http://download.csdn.net/detail/a22422931/9699529

铖snake

关注

3
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
android view放大被遮挡，我来解决

首先先来说说这个问题出现时的样式吧（如图1）。因为在做android TV应用开发时，很经常用到在控件获取焦点时，采用控件放大的动画效果，来增加用户的聚焦和体验。这时大家就想到直接让焦点控件执行放大动画，不就可以吗。但是当你直接这个做得时候，一个大问题就来了（如图1），你会发现放大的控件可以覆盖左上的控件，但是会被右下的控件覆盖。
复制链接

扫一扫