[Flutter][TIL] 직사각형 사용해 자식 자르는 ClipRect

ClipRect 는 위젯의 모양을 강제로 직사각형으로 자르는 클래스 이다.

찾아보니 직사각형이 아니라 다른 모양으로도 자를 수 있는게 여러가지 있었다.

 

• CustomClipper, for information about creating custom clips.
• ClipRRect, for a clip with rounded corners.
• ClipOval, for an elliptical clip.
• ClipPath, for an arbitrarily shaped clip.

아래는 사용 예시

Scaffold(
      body: Container(
        child: SafeArea(
          child: ListView(
            children: <Widget>[
              Stack(
                children: <Widget>[
                  Container(
                    width: double.maxFinite,
                    decoration: BoxDecoration(
                        image: DecorationImage(
                            image: AssetImage('images/' + widget.movie.poster),
                            fit: BoxFit.cover)),
                    child: ClipRect(
                      child: BackdropFilter(
                        filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
                        child: Container(
                          alignment: Alignment.center,
                          color: Colors.black.withOpacity((0.1)),
                          child: Container(
                            child: Column(
                              children: <Widget>[
                                Container(
                                  padding: EdgeInsets.fromLTRB(0, 45, 0, 10),
                                  child: Image.asset(
                                      'images/' + widget.movie.poster),
                                  height: 300,
                                )
                              ],
                            ),
                          ),
                        ),
                      ),
                    ),
                  )
                ],
              )
            ],
          ),
        ),
      ),
    );

---

ref : https://api.flutter.dev/flutter/widgets/ClipRect-class.html

ClipRect class - widgets library - Dart API