Doodle 0.8.0은 3D를 지원합니다.
2285 단어 kotlinwebdevshowdevjavascript
3D 변환
보기는 이제
transform
속성을 통해 완전한 3D 변환을 가질 수 있습니다. 이는 AffineTransform
가 x, y 및 z축과 관련된 축척, 회전 및 변환을 지원하도록 업데이트되었기 때문에 작동합니다. 그 결과, 그에 따라 수정된 변환을 제공하기만 하면 보기를 전체 3D 공간에 배치할 수 있습니다.import io.nacular.doodle.drawing.AffineTransform.Companion.Identity
import io.nacular.measured.units.Angle.Companion.degrees
// Rotate this View around they y-axis (through its center) by 45°
view.transform *= Identity.rotateY(around = view.center, by = 45 * degrees)
Canvas
도 새로운 3D 변환을 지원하기 때문에 보기도 이제 render in 3D 할 수 있습니다.view {
render = {
transform(Identity.rotateY(by = 45 * degrees)) {
// ...
}
}
}
3D 관점
사실적인 3D 공간에는 아핀 변환(평행선을 평행하게 유지) 이상의 것이 필요합니다. 이를 시뮬레이션하려면 원근 변환이 필요합니다. 보기에는 이제
camera
속성이 있어 3D 변환과 결합할 때 원근감을 제공합니다. 다음은 y축 회전이 보다 사실적으로 보이도록 합니다.import io.nacular.doodle.drawing.AffineTransform.Companion.Identity
import io.nacular.measured.units.Angle.Companion.degrees
// Rotate this View around they y-axis (through its center) by 45°
view.transform *= Identity.rotateY(around = view.center, by = 45 * degrees)
// Position the View's camera to apply some realistic perspective warping
view.camera = Camera(position = view.center, distance = 1000.0)
Canvas는 또한
Camera
메서드에서 transform
를 사용하여 원근감을 활성화합니다.view {
render = {
transform(Identity.rotateY(by = 45 * degrees), camera = Camera(Origin, distance = 1000.0)) {
// ...
}
}
}
Doodle은 웹(및 데스크톱)용 순수 Kotlin UI 프레임워크로, 이를 통해 Javascript, HTML 또는 CSS에 의존하지 않고도 풍부한 애플리케이션을 만들 수 있습니다. 자세한 내용은 documentation 및 tutorials을 확인하십시오.
Reference
이 문제에 관하여(Doodle 0.8.0은 3D를 지원합니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/pusolito/doodle-080-supports-3d-4ml4텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)