본문 바로가기

Provider8

[Flutter] 숙제 Book 애플리케이션 추가 구현 - ( week 4 ) 첫 번째 목표 ListTile의 subtitle 자리에 작가 이름, 책 발행일 가져와서 보여주기 작가 이름과 책 발행일은 줄 바꿈으로 구분 작가가 여러 명인 경우 각각의 작가명을 쉼표로 구분 API 확인 우선 가져올 정보를 API 데이터를 보고 확인한다. 필요한 정보인 작가와 발행일은 각각 authors, publicshedDate의 이름으로 들어온다. authors의 경우 리스트이기 때문에 받아올 때도 리스트에 담는다. class Book { String id; String title; String subtitle; List authors; String publishDate; String thumbnail; // 썸네일 이미지 링크 String previewLink; // ListTile 을 눌렀을 때.. 2023. 4. 29.
[Flutter] WebView 띄우기 - ( week 4 ) 책 목록에서 책을 선택했을 때 책에 대한 자세한 설명은 웹을 띄워서 보여주도록 한다. API에서 previewLink의 값을 활용해서 webview를 띄우도록 한다. previewLink: "http://books.google.co.kr/books?id=8OxGcCJViU4C&pg=PA160&dq=%24q&hl=&cd=1&source=gbs_api", WebView webview는 앱 내에서 웹 브라우저 컴포넌트를 사용해 웹 페이지를 띄우는 것을 말한다. 즉, 앱 내에 웹 브라우저를 넣어 주는 것이다. 대표적으로 webview를 사용한 것으로 Naver 앱이 있다. 네이버 앱은 UI가 모바일 웹사이트와 거의 동일한데 껍데기만 앱으로 만들고 내부는 WebView를 사용해서 모바일 사이트를 그대로 띄우는 방.. 2023. 4. 28.
[Flutter] 좋아요 구현 - ( week 4 ) 좋아요를 누른 책들은 좋아요 탭에서 모아서 볼 수 있도록 만든다. 이때 좋아요 페이지에서는 책들의 목록을 볼 수 있어야 하는데 이미 만들어 놓은 기능이 있기 때문에 이걸 별도의 기능으로 빼서 재사용할 수 있도록 한다. Book List main.dart > SearchPage에서 만들어놓은 ListTile 위젯을 추출한다. 추출한 위젯의 이름은 BookTile로 명명한다. ListView 내부의 ListTile 위젯이 외부로 분리되었다. itemBuilder: (context, index) { if (bookService.bookList.isEmpty) return SizedBox(); Book book = bookService.bookList.elementAt(index); return BookTile.. 2023. 4. 27.
[Flutter] 왓챠피디아 - API 연동 - ( week - 4 ) 구현 목표 Google Book API를 활용해서 왓챠피디아 앱에 책 검색 기능을 구현한다. 네트워크 통신을 하기 위해서 Dio 패키지를 사용한다. Dio dio 공식 문서에 나와있는 설치 명령어를 터미널에 입력한다. $ flutter pub add dio Dio 사용법 사용할 기능은 GET 메서드를 사용해서 URL로 요청을 보내고 비동기를 동기화시켜서 데이터를 받아서 사용한다. // GET 메서드를 사용해서 URL로 요청하기 main() { Dio().get("URL"); } // 비동기 동작을 동기로 구현 main() async { Response result = await Dio().get("URL");// get 함수는 Future를 반환한다. print(result.data); // data 안.. 2023. 4. 27.