chat 따로 만들기보다 . 그냥 , 웹뷰에다 주소 넣으면 빠르고 쉽게 Ai chat 완성 .
를 핑계로 만드는 . WebView 입니다. 웹뷰패키지를 설치하고 작성하면 됩니다.
import 'package:flutter/material.dart';
import 'package:screenshot/screenshot.dart';
import 'package:webview_flutter/webview_flutter.dart';
class WwwScreenHome extends StatefulWidget {
const WwwScreenHome({super.key});
@override
State<WwwScreenHome> createState() => _WwwScreenHomeState();
}
class _WwwScreenHomeState extends State<WwwScreenHome> {
late TextEditingController textEditingController;
late WebViewController webViewController;
//"https://www.google.com/"; 주소만 바꾸면 바드지 아니한가? ^^)/
String searchEnginUrl = "https://bard.google.com";
bool isLoading = false;
@override
void initState() {
textEditingController = TextEditingController(text: searchEnginUrl);
webViewController = WebViewController();
webViewController.setJavaScriptMode(JavaScriptMode.unrestricted);
webViewController.setNavigationDelegate(NavigationDelegate(onPageStarted: (url) {
textEditingController.text = url;
setState(() => isLoading = true);
}, onPageFinished: (url) {
setState(() => isLoading = false);
}));
loadUrl(textEditingController.text);
super.initState();
}
loadUrl(String urlValue) {
Uri uri = Uri.parse(urlValue);
if (!uri.isAbsolute) {
uri = Uri.parse("${searchEnginUrl}search?q=$urlValue");
}
webViewController.loadRequest(uri);
}
@override
void dispose() {
textEditingController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return SafeArea(
child: WillPopScope(
child: Scaffold(
body: Column(
children: [
_build_TopWidget(),
_build_LoadingWidget(),
Expanded(flex:6,child: _build_WebWidget()),
_build_BottomWidget(),
],
),
),
onWillPop: onWillPop),
);
}
Future<bool> onWillPop() async {
if (await webViewController.canGoBack()) {
webViewController.goBack();
return Future.value(false);
}
return Future.value(true);
}
_build_TopWidget() {
return Padding(
padding: const EdgeInsets.all(5.0),
child: Container(
alignment: Alignment.center,
decoration: BoxDecoration(
border: Border.all(),
borderRadius: const BorderRadius.all(Radius.circular(32)),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
IconButton(
onPressed: () {
loadUrl(searchEnginUrl);
},
icon: const Icon(Icons.home),
),
Expanded(
child: TextField(
controller: textEditingController,
decoration: const InputDecoration(
border: InputBorder.none,
hintText: "Search or type web address",
),
onSubmitted: (value) {
loadUrl(value);
},
)),
IconButton(
onPressed: () {
textEditingController.clear();
},
icon: const Icon(Icons.cancel))
],
),
),
);
}
_build_LoadingWidget() {
return Container(
height: 2,
color: Colors.grey,
child: isLoading ? const LinearProgressIndicator() : Container(),
);
}
_build_WebWidget() {
return WebViewWidget(controller: webViewController);
}
_build_BottomWidget() {
return BottomNavigationBar(
onTap: (value) {
switch (value) {
case 0:
webViewController.goBack();
case 1:
webViewController.goForward();
case 2:
webViewController.reload();
}
},
items: const [
BottomNavigationBarItem(icon: Icon(Icons.arrow_back,color: Colors.cyanAccent,), label: "Back"),
BottomNavigationBarItem(icon: Icon(Icons.arrow_forward,color: Colors.cyanAccent,), label: "Forward"),
BottomNavigationBarItem(icon: Icon(Icons.replay_outlined,color: Colors.cyanAccent,), label: "Reload"),
],
showSelectedLabels: false,
showUnselectedLabels: false,
unselectedItemColor: Colors.black54,
selectedItemColor: Colors.black54,
);
}
//
}
'Flutter' 카테고리의 다른 글
simple 코인 어플 만들기, 암호화 화폐 Bitcoin App , json으로 (0) | 2023.12.16 |
---|---|
동화책 만들기? OnBoardingScreen with GPT. (0) | 2023.12.15 |
Chat GPT 만들기 , 음성입력 gpt 3.5 turbo 202312 (0) | 2023.12.13 |
flutter Speech To Text // dart 3 (0) | 2023.12.10 |
Dark & Light Mode with Provider (0) | 2023.12.10 |