플러터 스터디 3주차

Udemy 강의범위

• 섹션9
• 섹션10
• 섹션11

 

Flutter Packages: https://pub.dartlang.org/flutter 

Page 1 | Top Flutter packages

 

패키지는 pubspec.yaml 파일 dependencies 항목에 패키지명을 추가하고 main.dart에서 import해서 사용하면 됨

 

Caret syntax

Caret syntax is a compact way of expressing the most common sort of version constraint. ^version means the range of all versions guaranteed to be backwards compatible with the specified version.

For example, ^1.2.3 is equivalent to '>=1.2.3 <2.0.0', and ^0.1.2 is equivalent to '>=0.1.2 <0.2.0'. The following is an example of caret syntax:

 

 

 

Expended로 세로를 균등하게 꽉 채운 뒤, CrossAxisAlignment.stretch로 가로로 꽉 채움

 

 

무료 사운드 모음 링크

https://freesound.org/  

 

import 'package:flutter/material.dart';
import 'package:audioplayers/audioplayers.dart';

void main() => runApp(XylophoneApp());

class XylophoneApp extends StatelessWidget {
  void playSound(int soundNumber) {
    final player = AudioCache();
    player.play('note$soundNumber.wav');
  }

  Expanded buildKey({required Color color, required int soundNumber}) {
    return Expanded(
      child: TextButton(
        style: TextButton.styleFrom(backgroundColor: color),
        onPressed: () {
          playSound(soundNumber);
        },
        child: Text(''),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: SafeArea(
          child:
              Column(crossAxisAlignment: CrossAxisAlignment.stretch, 
              children: [
                buildKey(color: Colors.red, soundNumber: 1),
                buildKey(color: Colors.orange, soundNumber: 2),
                buildKey(color: Colors.yellow, soundNumber: 3),
                buildKey(color: Colors.green, soundNumber: 4),
                buildKey(color: Colors.teal, soundNumber: 5),
                buildKey(color: Colors.blue, soundNumber: 6),
                buildKey(color: Colors.purple, soundNumber: 7),
              ]),
        ),
      ),
    );
  }
}