> Frontend
-
Flutter_04. Rendering Contents conditionally> Frontend/Flutter 2023. 4. 19. 21:15
1. Reformat. // quiz.dart contains contents MaterialApp import 'package:basic101_01/components/questions_screen.dart'; import 'package:basic101_01/components/start_screen.dart'; import 'package:flutter/material.dart'; class Quiz extends StatefulWidget { const Quiz({super.key}); @override State createState() { return _QuizState(); } } class _QuizState extends State { Widget activeScreen = const S..
-
Flutter_03. Excercise> Frontend/Flutter 2023. 4. 18. 21:30
1. 그 동안 배운 내용을 바탕으로 아래의 화면을 만들어보자. 2. import 'package:flutter/material.dart'; import 'components/start_screen.dart'; void main() { runApp( MaterialApp( home: Scaffold( body: Container( decoration: const BoxDecoration( gradient: LinearGradient( colors: [ Color.fromARGB(255, 78, 13, 151), Color.fromARGB(255, 107, 15, 168), ], begin: Alignment.topLeft, end: Alignment.bottomRight, ), ), child: const..
-
Flutter_20230414_02. StatefulWidget> Frontend/Flutter 2023. 4. 17. 20:09
1. Column() widget and Row() widget: - 예제: child: Center( child: Column( children: [ Image.asset('assets/images/dice-2.png', width: 200), TextButton(onPressed: rollDice, child: const Text('Roll Dice')) ], ), ), 2. 해당 widget은 StatelessWidget이기 때문에, 이런식으로 internally changing data 불가. class GradientContainer extends StatelessWidget { var activeDiceImage = 'assets/images/dice-2.png'; void rollDice()..
-
Flutter_20230414_01. Flutter> Frontend/Flutter 2023. 4. 14. 20:47
1. Review. -Task: From Parent add 2 colors to gradient_container.dart - 기존 부모에서 넘겨주는 부분과 Child Constructor 수정: body: const GradientContainer("Hello World", Color.fromARGB(255, 4, 2, 80), Color.fromARGB(255, 45, 7, 98)) const GradientContainer(this.text, this.color1, this.color2, {super.key}); - 이때, 기존에 사용하던 BoxDecoration의 const 를 삭제해야한다. 이유는, Color가 list형태인데, list 는 변화될 수 있기 떄문. decoration: BoxD..
-
Flutter_20230413_00. Flutter 입문> Frontend/Flutter 2023. 4. 13. 19:26
1. What is Class ? (Lec 35) - Dart is an object-oriented language. - Object is created by calling the constructor of a class - This simply means that Class is a blueprint of making/customizing Object. 2. Building widgets + Restructuring (Lec 36~37) class GradientContainer extends StatelessWidget { // GradientContainer({key}): super({key: key}); const GradientContainer({super.key}); // constructo..
-
001_CSS_Input의 text 타입에 숫자만 입력> Frontend/Publishing 2022. 6. 20. 11:26
Input 태그는 기본적으로 Number && String 입력가능합니다. 만약, 숫자만 입력하고 싶을때는 type="number"로 변경해도 됩니다만, 첫글자는 항상 아래의 사진과 같이 입력이 되더군요, 아래처럼 코딩하면, type을 text로 유지하면서, oninput을 사용하면 입력되는 내용이 숫자만 입력되게 할 수 있습니다. 해당 코드에서 .replace(/^0[^.]/, '0'); 을 제외하면 첫글자에 0을 입력할 수 있습니다.