코딩 다이어리

이번 시간에는 더보기를 누르면 Profile 화면이 보이고,프로필 화면은 이미지를 원형으로 추가, 그 아래에 링크를 추가하도록 함! 완성된 화면 미리보기 ~  1. 원형 이미지 추가CircleAvatar 를 이용해서 png 이미지를 원형으로 보이도록 추가 (프로필 사진 대용)https://api.flutter.dev/flutter/material/CircleAvatar-class.htmlContainer( padding: const EdgeInsets.only(top: 50), child: const CircleAvatar( radius: 100, backgroundImage: AssetImage('images/bbongflix_logo.png'), ),), 2. 클릭과 이동이 가능한 링..

넷플릭스에서 메인화면에 포스터가 크게 보이고, 옆으로 넘기면 다른 포스터가 보이는 화면을 구현해보았다- Carousel Slider Dependency 추가Carousel Slider를 사용하기 위해서는 디펜던시를 추가해줘야한다.pubspec.yamldependencies: flutter: sdk: flutter carousel_slider: ...저장하면 자동으로 필요한 파일을 다운로드 받고, 추가가 된다. Carousel Slider 추가현재 포스터가 무엇인지 기억하기 위해 index와  keyword 는 전역변수로 관리를 해주기로.!CarouselSlider( items: images, options: CarouselOptions(onPageChanged: (index, rea..

위 사진 처럼불러 처리된 이미지를 배경으로 하고, 그 위에 실제 이미지를 올리는 기능을 구현해보자! Blur 1. BoxDecoration 을 이용해 이미지를 불러온다.BoxDecoration : https://api.flutter.dev/flutter/painting/BoxDecoration-class.htmlContainer( width: double.maxFinite, decoration: BoxDecoration( image: DecorationImage( image: AssetImage('이미지 주소'), fit: BoxFit.cover, ),), 2. BackdropFilter를 이용한 블러 효과 적용...child: ClipRect( child:..

이번 시간에는 넷플릭스에 들어가는 N로고를 추가하는 방법에 대해 알아보는 시간~ 나는 강사님이 만들어주신 B로고를 그대로 사용했는데, Y로 바꾸고 싶다+_+ 이미지 파일 패키지에 추가하는 방법 1. root폴더 아래에 images폴더 생성 버튼 누르고 images 폴더 생성 (원하는 폴더명으로 하면 될 듯) 2. 생성한 폴더 (images)에 추가하고자 하는 이미지 파일 저장 3. pubspec.yaml 파일 수정 assets에 있는 주석을 지우고, 원하는 파일의 경로를 추가해주면 된다. ex) 수정 전 # To add assets to your application, add an assets section, like this: # assets: # - images/a_dot_burr.jpeg # - i..