Fluter의 ClipOval 애플릿을 사용했습니다!

1495 단어 Fluttertech

ClipOval이란?


ClipOval은 이미지 등을 통해 모서리의 돌출된 부분을 원형 또는 타원형에 플롯할 수 있는 부품입니다.

사용법


사용 방법은 이렇게 ClipOval로 싸서 사용하는 것입니다.
ClipOval(
    child: Image.asset('hoge.jpg'),
)
ClipOval은 기본적으로 원래 크기로 재단하기 때문에 세로 이미지는 긴 타원형이고 가로 이미지는 긴 타원형으로 재단됩니다.
ClipOvalデフォルト
원하는 사이즈로 만들려면 클립퍼를 추가합니다.
ClipOval(
    clipper: MyClipper(),
    child: Image.asset('hoge.jpg'),
)
클립을 새 클래스로 설치하고CustoomCliper를 확장하여 getClip과 shouldReclip 두 가지 방법을 실현한다.
getclip 메서드는 하위 크기를 가져와 Rect를 반환하고 Flutter는 타원을 그립니다.Rect는 어느 위치에서나 구성할 수 있습니다.예를 들어 다음 코드는 타원을 하위 20, 위 20, 너비 200, 높이 200픽셀로 설정합니다.
shouldReclip은 Cliper의 과거 상태에 따라 Flutter가 다시 잘라낼지 여부를 나타냅니다.Clipper의 상태가 정확히 동일한 자르기 상태이면 유효하게 휴가가 반환됩니다.
class MyClipper extends CustomClipper<Rect> {
    Rect getClip(Size size) {
        return const Rect.fromLTWH(20, 20, 200, 200);
    }

    bool shouldReclip(covariant CustomClipper<Rect> oldClipper) {
        throw UnimplementedError()
    }
}
ClipOvalデフォルト

총결산


・ClipOval에서는 이미지 등을 원형 또는 타원형으로 잘라낼 수 있습니다.
• 원하는 사이즈로 자르고 싶을 때 클립퍼를 추가합니다.

좋은 웹페이지 즐겨찾기