본문 바로가기
반응형

전체 글58

깃허브 사용법 정리 [Git 설치 & 환경설정 ] 1. Git 설치하기 : https://git-scm.com/ 2. 설치 완료 후 Git bash 열기 3. git bash 에서 환경설정 하기 - 유저이름 설정 git config --global user.name "your_name" - 유저 이메일 설정하기 git config --global user.email "your_email" (Github가입시 사용한 이메일) - 입력정보 확인하려면 git config --list 4. Github에 처음 코드 업로드하기 - 초기화 git init - 전체 프로젝트 파일 올리기 git add . - 상태확인 git status - 첫번째 커밋 히스토리 만들기 git commit -m "first commit" - 깃허브와 내 .. 2024. 4. 3.
06. 리스트뷰 빌터, 버튼에 기능 넣기 리스트뷰 빌더 형태. 아이템 카운트에 반복횟수, 아이템 빌더에 c, i 변수 두개 넣고 만든다. 리스트 타일을 쓰면 리딩과 타이틀 파라미터 활용할 수 있다 return MaterialApp( home: Scaffold( appBar: AppBar(), bottomNavigationBar: BottomTab(), body: ListView.builder( itemCount: 3, itemBuilder: (c,i){ return ListTile( leading: Image.asset('profile.jpg'), title: Text('James') ); }, ), ), ); } } class BottomTab extends StatelessWidget { const BottomTab({Key? key}) :.. 2024. 3. 7.
05. 커스텀 위젯, 리스트뷰, [커스텀 위젯] stless 친 후 탭키를 누른 후, 함수 이름과 기능을 넣는다. 재사용 많은 UI는 커스텀 위젯으로 만든다. 실시간 데이터 연동필요 요소가 포함된 경우에는 변수로 사용하면 성능 이슈가 있으므로 클래스를 만들어서 사용한다.) return MaterialApp( home: Scaffold( body: ShopItem(), ), ); } } class ShopItem extends StatelessWidget { const ShopItem({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return SizedBox( child: Text('hi'), ); } } [리스트뷰] 리스트뷰 안에 넣으면 스크롤.. 2024. 3. 6.
04. 당근st 모바일 화면 구성(expanded, flexible) Flexible을 사용하면 화면을 flex로 비율대로 나눠준다 body:Row( children: [ Flexible(child: Container(color:Colors.green), flex: 3,), Flexible(child: Container(color:Colors.yellow), flex: 7,), ], ), Expanded를 사용하면 1가진 플렉서블 박스랑 똑같다. 박스 하나만 꽉 채우고 싶다면 익스펜디드를 사용한다! 박스폭을 %로 주고 싶으면 플렉서블 박스 하나 넓게 채우려면 익스펜디드 body:Row( children: [ Container(width:200, color:Colors.yellow), Expanded(child: Container(color:Colors.green)), ],.. 2024. 2. 29.
03. 타이포그라피, 앱바 구성 텍스트 꾸미기는 텍스트 스타일 파라미터 안에서 처리할 수 있다. 앱바에서 좌상단 아이콘은 리딩, 오른쪽 아이콘들은 액션즈 파라미터를 사용한다. return MaterialApp( home: Scaffold( appBar: AppBar( leading:Icon(Icons.dehaze), title: Text('APP'), actions: [Icon(Icons.favorite), Icon(Icons.access_alarms),Icon(Icons.account_tree_outlined)], ), body: Column( children: [ SizedBox( child: Text('hi', style: TextStyle( color: Color.fromRGBO(102,000,102, 0.9), fontSize.. 2024. 2. 29.
02. 레이아웃과 박스디자인 - 스캐폴드를 사용하면 앱의 상/중/하단을 나눠서 사용할 수 있다 class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key); @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar(), body: Container(), bottomNavigationBar: BottomAppBar(child: Text('메뉴1'),), ) ); } } 바디 안에 여러개 요소를 배치하고 싶다면 컨테이너 말고, Row를 쓴다. Row 안에 children 요소를 배열로 [ ] 넣으면 됨. 가운데 정렬하려면 메인액시스얼라인먼.. 2024. 2. 29.
반응형

티스토리툴바