[Flutter] Container 둥글게 안될때 ClipRRect를 사용해보자

kimdocs...📄·2023년 12월 1일
0

flutter

목록 보기
28/30
Widget _buildItem({
  required BuildContext context,
  required String title,
  required String imgURL,
  required String level,
}) {
  double screenWidth = MediaQuery.of(context).size.width;
  double itemWidth = 149 / 375 * screenWidth;

  return Container(
    width: itemWidth,
    height: itemWidth,
    child: ClipRRect(
      borderRadius: BorderRadius.circular(20),
      child: Stack(
        alignment: Alignment.center,
        children: [
          Positioned.fill(
            child: Image.network(
                "이미지 URL"),
          ),
          Positioned.fill(
            child: Container(
              color: CustomColor.dim,
            ),
          ),
          Positioned(
            left: 12,
            right: 12,
            bottom: 14,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                ResizableTextContainer(
                  text: level,
                  textStyle:
                      CustomTextStyle.caption.copyWith(color: CustomColor.text_2nd),
                ),
                const SizedBox(
                  height: Spacing.s4,
                ),
                Text(title,
                    style: CustomTextStyle.subtitle1
                        .copyWith(color: CustomColor.secondary_3rd)),
              ],
            ),
          ),
        ],
      ),
    ),
  );
}
profile
👩‍🌾 GitHub: ezidayzi / 📂 Contact: ezidayzi@gmail.com

0개의 댓글