# animated

10개의 포스트
post-thumbnail

Card Project(Animated)

손으로 혹은 버튼으로 카드 무한으로 좌 혹은 우로 날리기

2022년 4월 13일
·
0개의 댓글
·
post-thumbnail

Animated(with Animated, interpolate)

import { Animated, Easing } from 'react-native'const Box = styled.View background-color: tomato; width: 200px; height: 200px;const AnimatedBox = An

2022년 4월 12일
·
0개의 댓글
·
post-thumbnail

React-Native(2.loagApp with animated, interaction)

npm i @types/styled-componentsnpm i @types/styled-components-react-native노가다로 animated 하기라이버러리 없이 animated 작업할려면 이렇게나 힘듦.

2022년 4월 11일
·
0개의 댓글
·

애니메이션 적용된 네비게이션 바 만들기

0. 커스텀 헤더의 필요성 모든 어플리케이션에는 다른 페이지로 이동하게 해주는 헤더가 들어간다. (아닌가?) React로 웹 어플리케이션을 구축할 때는 항상 상단에 고정되도록 했다. 사실 상단에 계속 고정되게 하는 네비게이션 바는 css를 아시는 분들이라면 모두 가능할

2022년 4월 9일
·
0개의 댓글
·

[메모] Animated Example

rotate: 360도 회전 (outputRange가 꼭 숫자이지 않아도 된다.)scale: input/outputRange 값에 따라 크기 확대/축소opacity: input/outputRange 값에 따라 투명도 조절애니메이션 작업을 자바스크립트 엔진이 아닌 네이티

2022년 3월 2일
·
0개의 댓글
·
post-thumbnail

[FLUTTER] AnimatedSwitcher()

오늘은 다양한 animation 기능을 만들 수 있는 AnimatedSwitcher() 위젯에 대하여 알아보겠다AnimatedSwitcher의 속성 값을 보면 transitionBuilder, layoutBuild에 대해서는 다음에 추가로 살펴볼 예정임시간을 제어하는

2021년 10월 15일
·
0개의 댓글
·

리액트 네이티브의 Animated

ViewScrollViewTextImage interpolate : inputRange, outputRange를 이용하여 설정객체를 만듦.timing : duration동안 동작하는 애니메이션loop : 무한반복parallel 복수 애니메이션 병렬처리seq

2021년 9월 11일
·
0개의 댓글
·

React Native: Animated Scroll Header 구현기

애니메이션을 만들기위한 핵심 워크 플로: Animated.Value를 만들고 애니메이션 구성 요소의 하나 이상의 스타일 속성에 연결한 다음 Animated.timing()을 사용해 애니메이션을 업데이트한다. 스크롤 이벤트 생성하기... 왼쪽 정렬 상태를 만들고 폰트

2020년 10월 29일
·
0개의 댓글
·