인 스 턴 스 분석 은 어떻게 안 드 로 이 드 응용 에서 탄막 애니메이션 효 과 를 실현 합 니까?

B 역 이나 다른 동 영상 사이트 에서 동 영상 을 볼 때 스크린 효 과 를 켜 고 프로그램 을 보면 서 여러분 의 토 크 를 보 는 경우 가 많 습 니 다.탄막 이 매우 재미 있어 보이 는데,오늘 우 리 는 간단 한 탄막 효 과 를 실현 할 것 이다.
2016428173817427.gif (1280×720)
 직관 적 으로 탄막 효 과 는 하나의 View Group 에 View 를 추가 한 다음 에 이 View 를 이동 시 키 는 것 이다.그래서 전체적인 실현 방향 은 다음 과 같다.
1.Relative Layout 를 정의 하고 그 안에 TextView 를 동적 으로 추가 합 니 다.
2.이 TextView 의 글꼴 크기,색상,이동 속도,초기 위 치 는 무 작위 입 니 다.
3.TextView 를 RelativeLayout 의 오른쪽 가장자리 에 추가 하고 일정 시간 마다 하 나 를 추가 합 니 다.
4.모든 TextView 에 대해 이동 애니메이션 을 해서 TextView 를 오른쪽 에서 왼쪽으로 이동 합 니 다.
5.TextView 가 왼쪽 에서 화면 을 이동 하면 TextView 를 RelativeLayout 에서 제거 합 니 다.
       아이디어 가 생기 면 구체 적 인 코드 를 보 겠 습 니 다.
       먼저 글꼴 내용,글꼴 크기 색상,이동 속도,수직 방향의 위치,글꼴 이 차지 하 는 너비 등 모든 탄막 항목 에 대한 정 보 를 저장 하기 위해 BarrageItem 을 정의 합 니 다.
 

public class BarrageItem { 
  public TextView textView; 
  public int textColor; 
  public String text; 
  public int textSize; 
  public int moveSpeed;//     
  public int verticalPos;//          
  public int textMeasuredWidth;//          
} 
       그 다음 에 BarrageView 를 정의 합 니 다.탄막 의 글꼴 색상 크기 와 이동 속 도 는 무 작위 이기 때문에 최대 최소 값 을 정의 하여 범 위 를 제한 한 다음 에 무 작위 수 를 만들어 이 범위 내 값 을 설정 해 야 합 니 다.또한 탄막 의 텍스트 내용 을 정의 해 야 합 니 다.여 기 는 죽은 것 을 직접 쓰 는 고정 값 입 니 다.
 
 

  private Context mContext; 
  private BarrageHandler mHandler = new BarrageHandler(); 
  private Random random = new Random(System.currentTimeMillis()); 
  private static final long BARRAGE_GAP_MIN_DURATION = 1000;//            
  private static final long BARRAGE_GAP_MAX_DURATION = 2000;//            
  private int maxSpeed = 10000;//  ,ms 
  private int minSpeed = 5000;//  ,ms 
  private int maxSize = 30;//    ,dp 
  private int minSize = 15;//    ,dp 
 
  private int totalHeight = 0; 
  private int lineHeight = 0;//         
  private int totalLine = 0;//      
  private String[] itemText = {"      ", "what are you    ", "       ", "    。。。。。。", "************", "      ","        ", "  ", "                     "}; 
  private int textCount; 
//  private List<BarrageItem> itemList = new ArrayList<BarrageItem>(); 
 
  public BarrageView(Context context) { 
    this(context, null); 
  } 
 
  public BarrageView(Context context, AttributeSet attrs) { 
    this(context, attrs, 0); 
  } 
 
  public BarrageView(Context context, AttributeSet attrs, int defStyleAttr) { 
    super(context, attrs, defStyleAttr); 
    mContext = context; 
    init(); 
  } 
       탄막 이 표시 하 는 수직 위치 가 무 작위 라면 수직 방향 에서 탄막 이 중첩 되 는 상황 이 발생 하기 때문에 높이 에 따라 수직 방향 을 탄막 높이 의 최대 치 로 등분 한 다음 에 탄막 이 지 정 된 수직 위치 에 무 작위 로 분포 하도록 해 야 한다.이 값 은 onWindow FocusChanged 에서 계산 합 니 다.이 방법 에서 View 의 getMeasured Height()를 통 해 얻 은 높이 가 비어 있 지 않 기 때 문 입 니 다.
 

@Override 
public void onWindowFocusChanged(boolean hasWindowFocus) { 
  super.onWindowFocusChanged(hasWindowFocus); 
  totalHeight = getMeasuredHeight(); 
  lineHeight = getLineHeight(); 
  totalLine = totalHeight / lineHeight; 
} 
      Handler sendEmptyMessageDelayed              。             。
 
class BarrageHandler extends Handler { 
  @Override 
  public void handleMessage(Message msg) { 
    super.handleMessage(msg); 
    generateItem(); 
    //              
    int duration = (int) ((BARRAGE_GAP_MAX_DURATION - BARRAGE_GAP_MIN_DURATION) * Math.random()); 
    this.sendEmptyMessageDelayed(0, duration); 
  } 
} 
 
private void generateItem() { 
  BarrageItem item = new BarrageItem(); 
  String tx = itemText[(int) (Math.random() * textCount)]; 
  int sz = (int) (minSize + (maxSize - minSize) * Math.random()); 
  item.textView = new TextView(mContext); 
  item.textView.setText(tx); 
  item.textView.setTextSize(sz); 
  item.textView.setTextColor(Color.rgb(random.nextInt(256), random.nextInt(256), random.nextInt(256))); 
  item.textMeasuredWidth = (int) getTextWidth(item, tx, sz); 
  item.moveSpeed = (int) (minSpeed + (maxSpeed - minSpeed) * Math.random()); 
  if (totalLine == 0) { 
    totalHeight = getMeasuredHeight(); 
    lineHeight = getLineHeight(); 
    totalLine = totalHeight / lineHeight; 
  } 
  item.verticalPos = random.nextInt(totalLine) * lineHeight; 
  showBarrageItem(item); 
} 
모든 탄막 항목 을 보기 에 추가 하고 View 에 TranslateAnimation 애니메이션 을 추가 합 니 다.애니메이션 이 끝 날 때 View 를 보기 에서 제거 합 니 다.
 

private void showBarrageItem(final BarrageItem item) { 
 
    int leftMargin = this.getRight() - this.getLeft() - this.getPaddingLeft(); 
 
    LayoutParams params = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT); 
    params.addRule(RelativeLayout.ALIGN_PARENT_TOP); 
    params.topMargin = item.verticalPos; 
    this.addView(item.textView, params); 
    Animation anim = generateTranslateAnim(item, leftMargin); 
    anim.setAnimationListener(new Animation.AnimationListener() { 
      @Override 
      public void onAnimationStart(Animation animation) { 
 
      } 
 
      @Override 
      public void onAnimationEnd(Animation animation) { 
        item.textView.clearAnimation(); 
        BarrageView.this.removeView(item.textView); 
      } 
 
      @Override 
      public void onAnimationRepeat(Animation animation) { 
 
      } 
    }); 
    item.textView.startAnimation(anim); 
  } 
 
  private TranslateAnimation generateTranslateAnim(BarrageItem item, int leftMargin) { 
    TranslateAnimation anim = new TranslateAnimation(leftMargin, -item.textMeasuredWidth, 0, 0); 
    anim.setDuration(item.moveSpeed); 
    anim.setInterpolator(new AccelerateDecelerateInterpolator()); 
    anim.setFillAfter(true); 
    return anim; 
  } 
이렇게 해서 탄막 의 기능 을 완 성 했 고 실현 원 리 는 복잡 하지 않다.구체 적 인 수요 에 따라 더 많은 통 제 를 증가 시 킬 수 있다.예 를 들 어 각 줄 의 탄막 이 중복 되 지 않 고 탄막 의 이동 을 제어 하 는 Interpolator 가 서로 다른 미끄럼 효 과 를 내 는 등 이다.

좋은 웹페이지 즐겨찾기