name27 / flutter

0 stars 0 forks source link

멤버함수를 이용한 UI - .map() .where() boxShadow #58

Open name27 opened 1 year ago

name27 commented 1 year ago

image

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Example1(),
    );
  }
}

class Example1 extends StatelessWidget {
  var mathData = [26, 2, 9, 47, 98, 24, 43, 99, 96, 45, 35, 
            19, 37, 60, 31, 74, 26, 4, 28, 19, 59, 14, 75, 13, 
            93, 88, 64, 15, 68, 34, 96, 48, 1, 44, 14, 11, 31, 
            39, 28, 100, 22, 73, 78, 98, 36, 49, 74, 16, 35, 91, 
            14, 73, 93, 49, 3, 99, 4, 29, 86, 56, 17, 13, 97, 55, 
            94, 7, 100, 66, 59, 85, 94, 11, 16, 48, 16, 44, 75, 14, 
            17, 88, 92, 12, 49, 35, 42, 82, 19, 27, 11, 21, 34, 27, 
            47, 40, 66, 90, 99, 93, 63, 90];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
      ),
      body: Center(
        child: GridView(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
          children:  mathData.map((e){
              return Padding(
                padding: const EdgeInsets.all(8.0),
                child: Container(
                child: Center(child: Text('$e')),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(15),
                  color: Colors.amber,
                  boxShadow: [
                    BoxShadow(
                      color: Colors.grey.withOpacity(0.5),
                      spreadRadius: 1.5,
                      blurRadius: 5,
                      offset: Offset(0, 0), 
                    )
                  ]
                ),
               ),
              );
            }
          ).toList(),
        ),
      ),
    );
  }
}
name27 commented 1 year ago

image

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Example1(),
    );
  }
}

class Example1 extends StatelessWidget {
  var mathData = [26, 2, 9, 47, 98, 24, 43, 99, 96, 45, 35, 
            19, 37, 60, 31, 74, 26, 4, 28, 19, 59, 14, 75, 13, 
            93, 88, 64, 15, 68, 34, 96, 48, 1, 44, 14, 11, 31, 
            39, 28, 100, 22, 73, 78, 98, 36, 49, 74, 16, 35, 91, 
            14, 73, 93, 49, 3, 99, 4, 29, 86, 56, 17, 13, 97, 55, 
            94, 7, 100, 66, 59, 85, 94, 11, 16, 48, 16, 44, 75, 14, 
            17, 88, 92, 12, 49, 35, 42, 82, 19, 27, 11, 21, 34, 27, 
            47, 40, 66, 90, 99, 93, 63, 90];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
      ),
      body: Center(
        child: GridView(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 4),
          children:  mathData.where((e){
            return e<10;
          }).map((e){
              return Padding(
                padding: const EdgeInsets.all(8.0),
                child: Container(
                child: Center(child: Text('$e')),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(15),
                  color: Colors.white,
                  boxShadow: [
                    BoxShadow(
                      color: Colors.grey.withOpacity(0.5),
                      spreadRadius: 1.5,
                      blurRadius: 5,
                      offset: Offset(0, 0), 
                    )
                  ]
                ),
               ),
              );
            }
          ).toList(),
        ),
      ),
    );
  }
}
name27 commented 1 year ago

image

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Example1(),
    );
  }
}

class Example1 extends StatelessWidget {
  var mathData = [26, 2, 9, 47, 98, 24, 43, 99, 96, 45, 35, 
            19, 37, 60, 31, 74, 26, 4, 28, 19, 59, 14, 75, 13, 
            93, 88, 64, 15, 68, 34, 96, 48, 1, 44, 14, 11, 31, 
            39, 28, 100, 22, 73, 78, 98, 36, 49, 74, 16, 35, 91, 
            14, 73, 93, 49, 3, 99, 4, 29, 86, 56, 17, 13, 97, 55, 
            94, 7, 100, 66, 59, 85, 94, 11, 16, 48, 16, 44, 75, 14, 
            17, 88, 92, 12, 49, 35, 42, 82, 19, 27, 11, 21, 34, 27, 
            47, 40, 66, 90, 99, 93, 63, 90];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
      ),
      body: ListView(
        children:  mathData.map((e){
            return Padding(
              padding: const EdgeInsets.all(8.0),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [Container(
                  width: e*2,
                  height: 24,
                child: Center(child: Text('$e')),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(15),
                  color: Colors.white,
                  boxShadow: [
                    BoxShadow(
                      color: Colors.grey.withOpacity(0.5),
                      spreadRadius: 1.5,
                      blurRadius: 5,
                      offset: Offset(0, 0), 
                    )
                  ]
                ),
                ),
              ],
              ),
            );
          }
        ).toList(),
      ),
    );
  }
}
name27 commented 1 year ago

ListView 안에 컨테이너 크기 조절