Android 사용자 정의 탄막 효과 구현

효과 도
일단 효과 도 를 볼 게 요.

2.실현 원리 방안
1.사용자 정의ViewGroup-XCDanmuView,계승RelativeLayout으로 이 루어 집 니 다.물론 다른 3 대 구조 류 도 계승 할 수 있 습 니 다.
2.몇 개TextView(탄막 의item View를 초기 화 합 니 다.여기TextView 를 예 로 들 면 물론 다른 것 도 가능 합 니 다~).그리고addView를 통 해 사용자 정의View에 추가 합 니 다.
3.addView을 통 해XCDanmuView에 추가 하고 위 치 는 좌표 에 있 으 며 화면 밖으로 이동 하여 들 어 오 는 효 과 를 실현 하기 위해
오른쪽 에서 왼쪽으로 이동 하면TextViewaddView의 위 치 를 오른쪽 화면 밖으로 설정 해 야 합 니 다.
이렇게 우리 가 사용 하 는 방법 은TextView방법 에서onLayout()에 대해childView위 치 를 재 구성 하 는 것 이다.
4.랜 덤 으로 왼쪽 이나 오른쪽 에서 탄막layout이 나 오고 이동 은 속성 애니메이션 으로 이동 하여 화면의 한 끝 에서 다른 한 끝 으로 이동 합 니 다.애니메이션 이 끝나 면
itemViewchild XCDanmuView은 떨 어 졌 다.그리고 다시remove탄막new 을 치고itemView 에서addView까지 애니메이션 이동 을 시작 합 니 다.
5.본 사용자 정의 탄막XCDanmuView은 왼쪽 에서 오른쪽,오른쪽 에서 왼쪽 두 방향 을 지원 하고 사용자 정의 설정 화면 탄막 의 최대 표 시 를 지원 합 니 다.
 
3.사용자 정의 탄막 효과 XCdanmuView 의 구체 적 인 실현
1.필요 한 데이터 변 수 를 초기 화 합 니 다.

private int mWidth;
  private int mScreenWidth;
  private List<View> mChildList;
  private boolean mIsWorking = false;
  private Context mContext;
  private int mMaxShowNum = 15;
  private int mRowNum = 4;
  private int[] mSpeeds = {
      3000,4000,5000,6000
  };
  private int mDelayDuration = 500;
  private int[] mBgResIds = {
      R.drawable.bg_danmu0,
      R.drawable.bg_danmu1,
      R.drawable.bg_danmu2,
      R.drawable.bg_danmu3
  };
  private int[] mRowPos = {
      150,140,160,150
  };
  private Random mRandom;
  private String[] mStrContents;
  public static enum XCDirection{
    FROM_RIGHT_TO_LEFT,
    FORM_LEFT_TO_RIGHT
  }
  public enum XCAction{
    SHOW,HIDE
  }
  private XCDirection mDirection = XCDirection.FROM_RIGHT_TO_LEFT;
  private void init() {
  mScreenWidth = getScreenWidth();
  mChildList = new ArrayList<>();
  mRandom = new Random();
}
2.여러 개의 탄막 item view 초기 화

public void initDanmuItemViews(String[] strContents){
    mStrContents = strContents;
    for(int i = 0; i < mMaxShowNum; i ++){
      int index = mRandom.nextInt(100) % strContents.length;
      createDanmuView(i,strContents[index],false);
    }
  }
3.탄막 item view 를 만 들 고 addView 를 XCdanmuView 에 추가 합 니 다.

public void createDanmuView(int index,String content,boolean reset){
    final TextView textView = new TextView(mContext);
    textView.setTextColor(Color.WHITE);
    int r = mRandom.nextInt(100) % mRowNum;
    textView.setBackgroundResource(mBgResIds[r]);
    textView.setText(content +"_"+ (index+1));
    RelativeLayout.LayoutParams lp = new LayoutParams(LayoutParams.WRAP_CONTENT,
        RelativeLayout.LayoutParams.WRAP_CONTENT);
    int row = mRandom.nextInt(100) % mRowNum;
    while(row == lastRow){
      row = mRandom.nextInt(100)% mRowNum;
    }
    int pos = mRandom.nextInt(100)% mRowNum;
    lp.topMargin = row * mRowPos[pos];
    lastRow = row;
    textView.setLayoutParams(lp);
    textView.setPadding(40, 2, 40, 2);
    this.addView(textView);
    if(reset){
      mChildList.set(index,textView);
    }else{
      mChildList.add(index,textView);
    }
    textView.setClickable(true);
    textView.setOnClickListener(new OnClickListener() {
      @Override
      public void onClick(View view) {
        Toast toast = Toast.makeText(mContext, textView.getText(), Toast.LENGTH_SHORT);
        toast.setGravity(Gravity.TOP,0,50);
        toast.show();
      }
    });
  }
4.childView 의 초기 위 치 를 화면 밖으로 다시 설정 합 니 다.

@Override
  protected void onLayout(boolean changed, int l, int t, int r, int b) {
    super.onLayout(changed, l, t, r, b);
    int childCount = this.getChildCount();
    for(int i=0;i<childCount;i++){
      View view = getChildAt(i);
      RelativeLayout.LayoutParams lp = (LayoutParams) view.getLayoutParams();
      if(lp.leftMargin <= 0){
        if(mDirection == XCDirection.FORM_LEFT_TO_RIGHT){
          view.layout(-view.getMeasuredWidth(), lp.topMargin,
              0,lp.topMargin + view.getMeasuredHeight());
        }else{
          view.layout(mScreenWidth,lp.topMargin,mScreenWidth+view.getMeasuredWidth(),
              lp.topMargin+view.getMeasuredHeight());
        }

      }else{
        continue;
      }
    }
  }
5.탄막 item view 의 이동 효과

private Handler mHandler = new Handler() {
    @Override
    public void handleMessage(final Message msg) {
      super.handleMessage(msg);
      final int pos = msg.what;
      ViewPropertyAnimator animator;
      if(mDirection == XCDirection.FROM_RIGHT_TO_LEFT){
        animator = mChildList.get(msg.what).animate()
            .translationXBy(-(mScreenWidth + mChildList.get(msg.what).getWidth()));
      }else{
        animator = mChildList.get(msg.what).animate()
            .translationXBy(mScreenWidth + mChildList.get(msg.what).getWidth());
      }

      Random random = new Random(System.currentTimeMillis());
      int index = random.nextInt(100) % mSpeeds.length;
      animator.setDuration(mSpeeds[index]);
      animator.setInterpolator(new LinearInterpolator());
      animator.setListener(new Animator.AnimatorListener() {
        @Override
        public void onAnimationStart(Animator animator) {

        }

        @Override
        public void onAnimationEnd(Animator animator) {
          XCDanmuView.this.removeView(mChildList.get(pos));
          int index = mRandom.nextInt(100) % mStrContents.length;
          createDanmuView(pos, mStrContents[index], true);
          mHandler.sendEmptyMessageDelayed(pos, mDelayDuration);
          Log.v("czm", "size=" + mChildList.size());
        }

        @Override
        public void onAnimationCancel(Animator animator) {

        }

        @Override
        public void onAnimationRepeat(Animator animator) {

        }
      });
      animator.start();
    }
  };
 6.탄막 효과 와 닫 기 효과 및 애니메이션 효과

boolean isFirst = true;
  public void start(){
    switchAnimation(XCAction.SHOW);
    if(isFirst){
      for(int i =0;i< mChildList.size();i++){
        mHandler.sendEmptyMessageDelayed(i,i * mDelayDuration);
      }
      isFirst = false;
    }

    mIsWorking = true;
  }
  public void hide(){
    switchAnimation(XCAction.HIDE);
    mIsWorking =false;
  }
  public void stop(){
    this.setVisibility(View.GONE);
    for(int i =0;i< mChildList.size();i++){
      mChildList.get(i).clearAnimation();
      mHandler.removeMessages(i);
    }
    mIsWorking =false;
  }
private void switchAnimation(final XCAction action){
    AlphaAnimation animation;
    if(action == XCAction.HIDE){
      animation = new AlphaAnimation(1.0f,0.0f);
      animation.setDuration(400);
    }else{
      animation = new AlphaAnimation(0.0f,1.0f);
      animation.setDuration(1000);
    }
    XCDanmuView.this.startAnimation(animation);
    animation.setAnimationListener(new Animation.AnimationListener() {
      @Override
      public void onAnimationStart(Animation animation) {

      }
      @Override
      public void onAnimationEnd(Animation animation) {
        if(action == XCAction.HIDE){
          XCDanmuView.this.setVisibility(View.GONE);
        }else{
          XCDanmuView.this.setVisibility(View.VISIBLE);
        }
      }
      @Override
      public void onAnimationRepeat(Animation animation) {

      }
    });
  }
4.이 사용자 정의 사 이 드 슬라이드 View 컨트롤 을 어떻게 사용 합 니까?
이 사용자 정의 View 를 사용 하 는 것 은 매우 간단 합 니 다.컨트롤 의 기본 효 과 는 오른쪽 에서 왼쪽으로,방향 을 왼쪽 에서 오른쪽으로 바 꾸 려 면 아래 방향 만 설정 하면 됩 니 다.

public class MainActivity extends Activity {

  private XCDanmuView mDanmuView;
  private List<View> mViewList;
  private String[] mStrItems = {
      "  ","  ",
      "  ","360",
      "    ","  ",
      "  ","  ",
      "  -       ","    ,    ",
      "    -    ","  -   ,   ",
      "Android-  ","IOS-  ",
      "Windows-  ","Linux"
  };
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    initDanmuView();
    initListener();
  }

  private void initListener() {
    findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View view) {
        if (mDanmuView.isWorking()) {
          mDanmuView.hide();
          ((Button) view).setText("    ");
        } else {
          mDanmuView.start();
          ((Button) view).setText("    ");
        }
      }
    });
  }

  private void initDanmuView() {
    mDanmuView = (XCDanmuView)findViewById(R.id.danmu);
    mDanmuView.initDanmuItemViews(mStrItems);
  }

}
총화
이상 은 안 드 로 이 드 에서 사용자 정의 탄막 효 과 를 실현 하 는 모든 내용 입 니 다.본 논문 의 내용 이 안 드 로 이 드 를 개발 할 때 도움 이 되 기 를 바 랍 니 다.궁금 한 점 이 있 으 면 댓 글로 소통 하 세 요.

좋은 웹페이지 즐겨찾기