Android 는 생방송 채 팅 영역 상단 의 그 라 데 이 션 효 과 를 실현 합 니 다.

배경
4 월 에 생방송 을 개발 할 때 한 가지 수요 가 있 는데 RecylerView 상단 의 그 라 데 이 션 효 과 를 실현 해 야 한다.
실제 효과

해결 방향
그래 픽 중첩 처리(본질은 알파 중첩 효과)
실현 절차
그림 을 저장 한 다음 에 그 라 데 이 션 을 그리고 마지막 에 원래 의 그림 과 합 쳐 이 효 과 를 얻 습 니 다.
관련 지식(모 르 는 것 은 google):
*      주로 RecyclerView 의 ItemDecoration 류 를 통 해 해결 된다.
*      Paint,Canvas,Shader,Xfermode(그림 융합) 
*      그 라 디 언 트(그 라 데 이 션)
자세 한 과정:
그림 층 의 중첩 은 Xfermode 를 통 해 이 루어 져 야 합 니 다.Xfermode 는 주로 서로 다른 그림 층 을 융합 시 켜 야 합 니 다.그러나 전 제 는 서로 다른 그림 층 이 같은 붓(Paint)으로 그 려 야 한 다 는 것 입 니 다.여기에 몇 가지 문 제 를 던 졌 다.
1.     어떻게 RecyclerView 의 모든 Item 의 그림 을 가 져 옵 니까?
2.     그림 층 을 가 져 옵 니 다.어떻게 이 그림 층 의 붓 과 그 라 데 이 션 그림 층 의 붓 을 일치 시 킵 니까?
3.     융합 방식,Xfermode 의 인 자 를 참조 하 시 겠 습 니까?
해결 방안
1.     자 료 를 찾 으 면 RecyclerView 의 ItemDecoration 추상 류 를 통 해 알 수 있 고 그림 의 앞 뒤 이 벤트 를 그 릴 수 있 습 니 다.onDraw:Item 이 시작 한 이벤트 리 셋 을 그립 니 다.onDrawOver:Item 이 끝 난 이벤트 리 셋 을 그립 니 다.Parent 계산 을 통 해 해당 아 이 템 이나 Canvas 패 널 을 가 져 올 수 있 습 니 다.
2.     Canvas 의 saveLayer 방법 은 현재 Canvas 를 Paint 에 저장 한 다음 이 Paint 로 그 라 데 이 션 그래 픽 을 그리 면 두 개의 그래 픽 이 같은 붓 을 그 리 는 조건 을 실현 합 니 다.
3.     융합 방식,DST 사용IN,하단 층 은 채 팅 아 이 템,상층 부 는 그 라 데 이 션 아 이 템,알파 가 융합 되면 채 팅 아 이 템 이 그 라 데 이 션 효 과 를 낸다.(머 릿 결
구체 적 인 코드:

public void doTopGradualEffect(){
  if(recyclerView == null){
   return ;
  }

  mPaint = new Paint();
  //    
  final Xfermode xfermode = new PorterDuffXfermode(PorterDuff.Mode.DST_IN);
  mPaint.setXfermode(xfermode);
  //         ，         
  linearGradient = new LinearGradient(0.0f, 0.0f, 0.0f, 100.0f, new int[]{0, Color.BLACK}, null, Shader.TileMode.CLAMP);

  recyclerView.addItemDecoration(new RecyclerView.ItemDecoration() {
   //   RecyclerView，              ，        
   @Override
   public void onDrawOver(Canvas canvas, RecyclerView parent, RecyclerView.State state) {
    super.onDrawOver(canvas, parent, state);

    mPaint.setXfermode(xfermode);
    mPaint.setShader(linearGradient);
    canvas.drawRect(0.0f, 0.0f, parent.getRight(), 200.0f, mPaint);
    mPaint.setXfermode(null);
    canvas.restoreToCount(layerId);
   }

   @Override
   public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
    super.onDraw(c, parent, state);
    layerId = c.saveLayer(0.0f, 0.0f, (float) parent.getWidth(), (float) parent.getHeight(), mPaint, Canvas.ALL_SAVE_FLAG);
   }

   @Override
   public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
    super.getItemOffsets(outRect, view, parent, state);
   }
  });
 }

데모 이미 github 업로드:https://github.com/HarrisonLin/RecyclerViewEffectGather관심 있 는 것 은 다운로드 할 수 있 습 니 다.
총결산
이상 은 이 글 의 전체 내용 입 니 다.본 논문 의 내용 이 여러분 의 학습 이나 업무 에 어느 정도 참고 학습 가치 가 있 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 댓 글 을 남 겨 주 셔 서 저희 에 대한 지지 에 감 사 드 립 니 다.