Ui (8) 썸네일형 리스트형 flutter 키보드 입력 Overflow 해결 키보드 문제로 아래처럼 오버플로우 문제가 나타나는 일이 종종 생긴다. 하지만, 핸드폰 기종마다 해상도도 다르고 해서 , 무조껀 해두는 편이 낫다. resizeToAvoidBottomInset: false, 를 Scaffold 에 한줄 추가 단점: 입력창 위치에 따라 가려 질 수 있다. @override Widget build(BuildContext context) { return Scaffold( resizeToAvoidBottomInset: false,// 오버플로우 appBar: AppBar(title: Text('bloc searchlist')), body: Container( child: Column( children: [ TextField( controller: searchTextControll.. Ui 패키지 없이 그라디에이션 꾸미기. 컨테이너, 텍스트 등 . 아래와 같이 그라데이션을 패키지 없이 작성이 가능 합니다. final gradient = LinearGradient( begin: Alignment.topLeft, end: Alignment.bottomRight, colors: [Colors.blueAccent, Colors.redAccent, Colors.amberAccent]); 텍스트 자체의 Shadow 그림자 . . Text('Do Not \nUse\nPackage\nFor this\nGradation.', style: TextStyle(fontSize: 50,fontWeight: FontWeight.bold, shadows: [ Shadow( blurRadius:10.0, // shadow blur color: Colo.. Ui 배경화면 설정에서 그라디언트까지, set Background Container 를 사용해서 DecorationImage 로 설정하기 class OnHomeScreen extends StatelessWidget { @override Widget build(BuildContext context) { var imagePath ='https://cdn.pixabay.com/photo/2023/11/26/08/27/leaves-8413064_640.jpg'; return Scaffold( body: Container( decoration: BoxDecoration( color: Colors.white, image: DecorationImage(image: NetworkImage(imagePath), fit: BoxFit.cover), ), child: Center(chil.. Simple note Ui 간단한. GridView 를 이용한. 메모 Ui 이다. SliverGridDelegateWithFixedCrossAxisCount import 'package:flutter/material.dart'; import 'dart:math'; class Ui_NotePage extends StatefulWidget { const Ui_NotePage({super.key}); @override State createState() => _Ui_NotePageState(); } class _Ui_NotePageState extends State { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar(title: Text('si.. Ui Flutter Design Morphism 로그인 픽사베이에 가니 인공지능이 그린 그림들이 많이 나오고 있다. 이번에 사용한 그림도 인공지능이 그린그림이다. import 'dart:ui'; import 'package:flutter/material.dart'; class MorphLogIn extends StatefulWidget { const MorphLogIn({super.key}); @override State createState() => _MorphLogInState(); } class _MorphLogInState extends State { @override Widget build(BuildContext context) { double height = MediaQuery.sizeOf(context).height; double width = .. Ui login design 에뮬레이터는 길이가 짧아서 인지 . 짜리몽땅하게 나왔습니다. 기기마다 위아래 변화가 보이는 모습에 영향을 많이 주는듯 코드와 완성이미지는 아래에 import 'package:flutter/material.dart'; import 'package:noti_local/a_drawer.dart'; class UiFallLogin extends StatefulWidget { const UiFallLogin({super.key}); @override State createState() => _UiFallLoginState(); } class _UiFallLoginState extends State { late Color mainColor; late Size mediaSize; late TextEditingCont.. Design Glass Morphism 로그인 1 맨아래 버튼은 적용 안해도 되며 . 그래도 코드는 맨아래에 작성 . 2 이미지는 픽사베이 링크 networImage 3 4 home late TextEditingController emailController; late TextEditingController passwordController; @override void initState() { emailController = TextEditingController(); passwordController = TextEditingController(); super.initState(); } @override void dispose() { emailController.dispose(); passwordController.dispose(); super.di.. CustumClipper 로그인 페이지 디자인. late TextEditingController emailController; late TextEditingController passwordController; @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.white, drawer: ADrawer(), appBar: AppBar( title: Text('Google LogIn'), ), body: SingleChildScrollView( child: Column( children: [ SizedBox( height: MediaQuery.sizeOf(context).height * 0.7, width: double.infinity, child:.. 이전 1 다음
