Android 애니메이션 입문 강좌 의 kotlin

머리말
구 글 은 올해 IO 콘 퍼 런 스에 서 안 드 로 이 드 가 개발 한 공용 어 를 Kotlin 으로 교체 하 겠 다 고 발표 했다.구 글 을 따라 안 드 로 이 드 를 하 는 사람 으로서 우 리 는 가능 한 한 빨리 Kotlin 언어 를 이해 하고 사용 해 야 한다.
본 고 는 안 드 로 이 드 애니메이션 입문 의 kotlin 에 관 한 내용 을 상세 하 게 소개 하고 참고 학습 을 제공 할 것 입 니 다.다음은 더 이상 할 말 이 없 으 니 상세 한 소 개 를 해 보 겠 습 니 다.
속성 애니메이션
약술 하 다
핸드폰 에서 일부 애니메이션 효 과 를 실현 하 는 것 은 비교적 멋 진 일이 라 고 할 수 있 기 때문에 안 드 로 이 드 시스템 은 처음에 우리 에 게 애니메이션 효 과 를 실현 하 는 두 가지 방식 을 제공 했다.한 프레임 애니메이션(frame-b-frame animation)과 보충 애니메이션(tweened animation)이다.한 프레임 애니메이션 의 작업 원 리 는 매우 간단 하 다.사실은 완전한 애니메이션 을 하나의 단독 그림 으로 나 눈 다음 에 이 를 연결 하여 재생 하 는 것 이다.애니메이션 과 유사 한 작업 원리 이다.추가 애니메이션 은 View 에 대해 일련의 애니메이션 작업 을 할 수 있 는데 페이드아웃,크기 조정,이동,회전 네 가 지 를 포함한다.
그러나 안 드 로 이 드 3.0 버 전부터 시스템 은 우리 에 게 새로운 애니메이션 모델 을 제공 해 주 었 다.속성 애니메이션(property animation)은 그의 기능 이 매우 강하 고 예전 에 보 간 애니메이션 의 일부 결함 을 보완 하여 보 간 애니메이션 을 완전히 대체 할 수 있다.한 프레임 애니메이션 과 보충 애니메이션 의 용법 에 대해 저 는 더 이상 말 하고 싶 지 않 습 니 다.그들의 기술 이 비교적 늙 었 고 인터넷 자료 도 매우 많 습 니 다.그러면 오늘 우리 글 의 주 제 는 바로 Android 속성 애니메이션 을 완전히 해석 하 는 것 입 니 다.
속성 애니메이션 을 왜 도입 합 니까?
Android 이전의 추가 애니메이션 체 제 는 비교적 건전 한 편 이다.android.view.animation 패키지 아래 에 우리 가 조작 할 수 있 는 여러 가지 유형 이 있어 서 일련의 애니메이션 효 과 를 완성 할 수 있다.예 를 들 어 View 에 대해 이동,확대,회전 과 페이드아웃 을 하고 우 리 는 AnimationSet 을 통 해 이런 애니메이션 효 과 를 조합 해서 사용 할 수 있다.그 밖 에 Interpolator 설정 을 통 해 애니메이션 의 재생 속 도 를 조절 할 수 있 습 니 다.그러면 여기 서 여러분 들 은 의문 이 생 길 것 입 니 다.예전 의 애니메이션 체제 가 이렇게 건전 한 이상 왜 속성 애니메이션 을 도입 해 야 합 니까?
사실은 위 에서 말 하 는 건전 성 은 모두 상대 적 인 것 입 니 다.만약 에 귀하 의 수요 에서 View 를 이동,확대,회전 과 페이드아웃 작업 만 하면 보충 애니메이션 은 충분히 건전 합 니 다.그러나 이러한 기능 은 모든 장면 을 커버 하기에 부족 하 다.만약 에 우리 의 수요 가 이동,확대,회전 과 페이드아웃 이라는 네 가지 View 에 대한 조작 을 초과 하면 보충 애니메이션 은 더 이상 우 리 를 도와 줄 수 없다.즉,기능 과 확장 가능 한 측면 에서 상당 한 한계점 을 가진다.그럼 보 간 애니메이션 이 감당 할 수 없 는 장면 을 살 펴 보 겠 습 니 다.
메모:위 에서 제 가 보충 애니메이션 을 소개 할 때'View 에 대한 조작'이라는 설명 을 사 용 했 습 니 다.맞아요.보충 애니메이션 은 View 에 만 작용 할 수 있 습 니 다.즉,우 리 는 Button,TextView,심지어 LinearLayout,또는 View 를 계승 하 는 다른 구성 요소 에 대해 애니메이션 작업 을 할 수 있 습 니 다.그러나 우리 가 View 가 아 닌 대상 에 대해 애니메이션 작업 을 하려 면 죄 송 하지만 추가 애니메이션 은 도움 이 되 지 않 습 니 다.어떤 친구 들 은 이해 할 수 없다 고 느 낄 수 있 습 니 다.제 가 어떻게 비 View 대상 에 대해 애니메이션 작업 을 해 야 합 니까?여기 서 저 는 간단 한 예 를 들 어 사용자 정의 View 가 있 습 니 다.이 View 에서 Point 대상 이 좌 표를 관리 하 는 데 사 용 된 다음 에 onDraw()방법 에서 이 Point 대상 의 좌표 값 에 따라 그 렸 습 니 다.즉,우리 가 Point 대상 에 대해 애니메이션 작업 을 할 수 있다 면 전체 사용자 정의 View 의 애니메이션 효과 가 있 을 것 이다.분명히 보 간 애니메이션 은 이 기능 을 갖 추 지 못 한 것 이 첫 번 째 결함 이다.
그 다음 에 애니메이션 을 보충 하 는 데 또 하나의 결함 이 있 습 니 다.바로 이동,확대,회전 과 페이드아웃 등 네 가지 애니메이션 작업 만 실현 할 수 있다 는 것 입 니 다.만약 에 우리 가 View 의 배경 색 을 동태 적 으로 바 꾸 기 를 원한 다 면?유 감 스 럽 지만 우 리 는 스스로 실현 할 수 밖 에 없다.말하자면 이전의 보충 애니메이션 메커니즘 은 하 드 코딩 방식 으로 완 성 된 것 이 고 기능 한정 사 는 바로 이런 것 이다.기본적으로 확장 성 이 없다.
마지막 으로 보 간 애니메이션 은 또 하나의 치 명 적 인 결함 이 있다.바로 View 의 디 스 플레이 효 과 를 바 꾸 었 을 뿐 View 의 속성 을 진정 으로 바 꾸 지 않 는 다 는 것 이다.무슨 뜻 이 죠?예 를 들 어 현재 화면의 왼쪽 상단 에 버튼 이 있 습 니 다.그리고 우 리 는 보충 애니메이션 을 통 해 화면의 오른쪽 하단 으로 이동 시 켰 습 니 다.지금 은 이 단 추 를 눌 러 보 세 요.이 단 추 를 누 르 면 이벤트 가 절대 촉발 되 지 않 습 니 다.실제로 이 단 추 는 화면의 왼쪽 상단 에 머 물 러 있 기 때 문 입 니 다.이 단 추 를 화면의 오른쪽 아래 에 보 간 애니메이션 으로 그 렸 을 뿐 입 니 다.
바로 이런 이유 로 안 드 로 이 드 개발 팀 은 3.0 버 전에 속성 애니메이션 이라는 기능 을 도입 하기 로 결정 했다.그러면 속성 애니메이션 은 상기 문 제 를 모두 해결 하 는 것 이 아 닐 까?다음은 우리 한번 봅 시다.
새로 도 입 된 속성 애니메이션 체 제 는 더 이상 View 를 대상 으로 디자인 된 것 이 아니 라 이동,확대,회전 과 페이드아웃 등 몇 가지 애니메이션 작업 만 실현 하 는 것 에 국한 되 지 않 고 시각 적 인 애니메이션 효과 도 아니다.이것 은 실제 적 으로 값 을 끊임없이 조작 하 는 메커니즘 이 고 값 을 지정 한 대상 의 지정 속성 에 부여 하 며 임의의 대상 의 임 의 속성 일 수 있다.그래서 저 희 는 하나의 View 를 이동 하거나 확대 할 수 있 지만 사용자 정의 View 의 Point 대상 에 대해 애니메이션 작업 도 할 수 있 습 니 다.우 리 는 시스템 애니메이션 의 운행 시간 이 길 고 어떤 유형의 애니메이션 을 실행 해 야 하 는 지,그리고 애니메이션 의 초기 값 과 끝 값 만 알려 주면 나머지 작업 은 모두 시스템 에 맡 길 수 있다.
속성 애니메이션 의 실현 체 제 는 목표 대상 에 대한 할당 과 속성 을 수정 함으로써 이 루어 진 것 이기 때문에 앞에서 말 한 버튼 에 나타 난 문제 도 존재 하지 않 습 니 다.만약 에 우리 가 속성 애니메이션 을 통 해 단 추 를 이동 하면 이 단 추 는 다른 위치 에서 만 그 려 진 것 이 아니 라 진정한 이동 입 니 다.
자,이렇게 많은 것 을 소 개 했 습 니 다.여러분 들 이 속성 애니메이션 에 대해 가장 기본 적 인 인식 을 가지 게 되 었 다 고 믿 습 니 다.다음은 속성 애니메이션 의 용법 을 배우 도록 하 겠 습 니 다.
핵심 클래스
ValueAnimator:이 종 류 는 Animator 의 하위 클래스 로 애니메이션 의 전체 처리 논 리 를 실 현 했 고 속성 애니메이션 의 핵심 유형 이기 도 합 니 다
  • ObjectAnimator:대상 속성 애니메이션 의 조작 유형 은 ValueAnimator 에서 계승 되 고 이 를 통 해 애니메이션 형식 으로 대상 의 속성 을 조작 합 니 다
  • TimeInterpolator:시간 플러그 인,그의 역할 은 시간 이 흐 르 는 백분율 에 따라 현재 속성 값 이 변 하 는 백분율 을 계산 하 는 것 이다.시스템 에 미리 설 치 된 선형 플러그 인(Linear Interpolator),가속 플러그 인(AccelerateDeceleratenterpolator)과 감속 플러그 인(DecelerateInterpolator)등 이 있다
  • TypeEvaluator:TypeEvaluator 의 중국 어 를 유형 평가 알고리즘 으로 한다.그의 역할 은 현재 속성 이 변 한 백분율 에 따라 변 경 된 속성 치 를 계산 하 는 것 이다.시스템 이 미리 지원 하 는 것 은 성형 속성(IntEvaluator),부동 소수점 형(Float Evaluator)과 Color 속성(ArgbEvaluator)이 있다
  • Property:속성 대상 은 주로 속성의 set 와 get 방법 을 정의 합 니 다
  • Property Values Holder:Property Values Holder 는 목표 속성 을 가 진 Property,setter 와 getter 방법 및 관건 프레임 의 집합 이다
  • KeyframeSet:애니메이션 의 키 프레임 집합 을 저장 합 니 다
  • Animotion Proxy:3.0 이하 View 의 속성 애니메이션 을 사용 하 는 보조 클래스
  • 기본 사용
    이것 은 textview 를 눌 러 아래로 이동 시 키 는 demo 입 니 다.
    효과 전시

    xml:
    
    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent" tools:context="transformation.numberutils.wushaocong.manimotor.MainActivity"> 
     <TextView
      android:text="  "
      android:textSize="20sp"
      android:layout_centerInParent="true"
      android:id="@+id/mtext"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content" />
    </RelativeLayout>
    kotlin:
    
    class MainActivity : AppCompatActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_main)
      var y = 100f
      mtext.setOnClickListener { v ->
       ObjectAnimator.ofFloat(v, "translationY", y).start()
       y+=100f
      }
     }
    }
    이것 은 textview 의 배경 을 3 초 동안 0xF 000000 에서 0xF 00ffff 로 무한 재생 하고 반전 효과 가 있 습 니 다.

    방금 전의 코드 를 직접 수정 하 다
    
    class MainActivity : AppCompatActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_main)
      var y = 100f
      mtext.setOnClickListener { v ->
       val colorAnimator = ObjectAnimator.ofInt(v,"backgroundColor",0xF000000,0xF00ffff)
       //      
       colorAnimator.setDuration(3000)
       //     
       colorAnimator.setEvaluator(ArgbEvaluator())
       //         
       colorAnimator.repeatCount = ValueAnimator.INFINITE
       //        
       colorAnimator.repeatMode = ValueAnimator.REVERSE
       colorAnimator.start()
      }
     }
    }
    마지막 으로 궁극 의 애니메이션 그룹 을 하나 더 하 겠 습 니 다.

    코드 변경:
    
    class MainActivity : AppCompatActivity() {
     override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_main)
      var y = 100f
      mtext.setOnClickListener { v ->
       var animators = listOf<ObjectAnimator>(
         ObjectAnimator.ofFloat(v,"rotationX",0f,360f),
         ObjectAnimator.ofFloat(v,"rotationY",0f,180f),
         ObjectAnimator.ofFloat(v,"rotation",0f,-90f),
         ObjectAnimator.ofFloat(v,"translationX",0f,90f),
         ObjectAnimator.ofFloat(v,"translationY",0f,90f),
         ObjectAnimator.ofFloat(v,"scaleY",1f,1.5f),
         ObjectAnimator.ofFloat(v,"scaleX",1f,0.5f),
         ObjectAnimator.ofFloat(v,"alpha",0f,1f,0.25f,1f)
       )
       val set = AnimatorSet()
       set.playTogether(animators)
       set.setDuration(6*1000).start()
      }
     }
    }
    총결산
    이상 은 이 글 의 전체 내용 입 니 다.본 논문 의 내용 이 여러분 의 학습 이나 업무 에 어느 정도 참고 학습 가치 가 있 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 댓 글 을 남 겨 주 셔 서 저희 에 대한 지지 에 감 사 드 립 니 다.

    좋은 웹페이지 즐겨찾기