flutter34 [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. [Flutter] 왓챠피디아 - 프로젝트 세팅 - ( week 4 ) 왓챠피디아 앱 구현 프로젝트 준비 새로운 Flutter 프로젝트 생성 provider 패키지 설치 파일 추가 생성 : book.dart, book_service.dart 베이스 코드 작성 main.dart import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; import 'book_service.dart'; void main() { runApp( MultiProvider( providers: [ ChangeNotifierProvider(create: (context) => BookService()), ], child: const MyApp(), ), ); } class MyApp extends StatelessWi.. 2023. 4. 26. 이전 1 2 3 4 5 ··· 9 다음
