커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
2-7 다양한 피드 이미지 보여주기 2:17~2:26 / 4:03 ~4:11 이해가 잘 안돼요..
[왕초보] 플러터(Flutter)로 시작하는 앱개발 종합반 v0
2주차
북마크
이*준
댓글
5
추천
0
조회수
13
조회수
13
답변 완료

* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.


final String imageUrl;

이건 이해한거 같아요. 파이널은 아직 확정된건 아닌데, 나중에 실행될 때 확정해줄거야라는 말이고,

String은 문자열이란 것이고, 변수명은 imageUrl 이란거죠.


문제는 required this.imageUrl,

이부분입니다.


required 는 필수적이란 뜻? 인가요.. 무튼.. this는 음.. ;; this도 잘 모르는거같고요..

imageUrl 이것도 여기선 변수명이 아니고, 밑에 있는 거를 전달한다는데,

보통 변수관련된걸 실행하는거는 아래쪽에 사용하지 않나요? 위쪽에서도 쓸 수 있는건가요?


음.. 전체적으로 저 부분이 이해가 잘 안되는거 같아요. ㅠㅠ 뭐를 모르는지 설명도 못하는군요. ㅠㅠ

(2-7 다양한 피드 이미지 보여주기 2:17~2:26 / 4:03 ~4:11)


스파르타 즉문즉답스파르타 즉문즉답




작성한 코드 및 에러 메세지

: 오류난 부분은 아닙니다만.. 코드를 공유해봅니다. (기본값 그대로 입니다)

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';


class Feed extends StatefulWidget {
  const Feed({
    super.key,
    required this.imageUrl,
  });


  final String imageUrl; // 이미지를 담을 변수


  @override
  State<Feed> createState() => _FeedState();
}


class _FeedState extends State<Feed> {
  // 좋아요 여부
  bool isFavorite = false;


  @override
  Widget build(BuildContext context) {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // CilpRRect 를 통해 이미지에 곡선 border 생성
        ClipRRect(
          borderRadius: BorderRadius.circular(8),
          // 이미지
          child: Image.network(
            widget.imageUrl, // 10번째 줄의 imageUrl 가져오기
            width: 100,
            height: 100,
            fit: BoxFit.cover,
          ),
        ),
        SizedBox(width: 12),
        Expanded(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                'M1 아이패드 프로 11형(3세대) 와이파이 128G 팝니다.',
                style: TextStyle(
                  fontSize: 16,
                  color: Colors.black,
                ),
                softWrap: false,
                maxLines: 2,
                overflow: TextOverflow.ellipsis,
              ),
              SizedBox(height: 2),
              Text(
                '봉천동 · 6분 전',
                style: TextStyle(
                  fontSize: 12,
                  color: Colors.black45,
                ),
              ),
              SizedBox(height: 4),
              Text(
                '100만원',
                style: TextStyle(
                  fontSize: 14,
                  fontWeight: FontWeight.bold,
                ),
              ),
              Row(
                children: [
                  Spacer(),
                  GestureDetector(
                    onTap: () {
                      // 화면 갱신
                      setState(() {
                        isFavorite = !isFavorite; // 좋아요 토글
                      });
                    },
                    child: Row(
                      children: [
                        Icon(
                          isFavorite
                              ? CupertinoIcons.heart_fill
                              : CupertinoIcons.heart,
                          color: isFavorite ? Colors.pink : Colors.black,
                        ),
                        Text(
                          '1',
                          style: TextStyle(color: Colors.black54),
                        ),
                      ],
                    ),
                  )
                ],
              ),
            ],
          ),
        ),
      ],
    );
  }
}


Tip 1) </> 아이콘을 눌러 코드박스를 만들어 보세요.

Tip 2) Ctrl+A(맥의 경우 Command+A) 단축키로 코드를 한 번에 선택할 수 있어요!




취소
 공유
취소
댓글 0
댓글 알림
나의얼굴