[flutter] 플러터 Slider와 AppBar 위젯의 연동 방법은?

08 Dec 2023

flutter

플러터에서 Slider와 AppBar 위젯을 연동하는 방법은 간단합니다. 먼저 Slider를 AppBar에 표시하고자 하는 경우, AppBar의 leading 또는 actions 속성을 사용하여 Slider를 추가할 수 있습니다.

다음은 Slider와 AppBar 위젯을 연동하는 방법을 설명한 코드 예시입니다.

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Slider in AppBar'),
          actions: [
            Slider(
              value: _currentSliderValue,
              min: 0,
              max: 100,
              onChanged: (double value) {
                setState(() {
                  _currentSliderValue = value;
                });
              },
            ),
          ],
        ),
        body: Center(
          child: Text('Slider Value: $_currentSliderValue'),
        ),
      ),
    );
  }
}

위 코드에서는 AppBar의 actions 속성에 Slider를 추가하여 AppBar에 Slider를 표시했습니다.

위 코드를 실행하면 AppBar에 Slider가 표시되고, Slider를 조작할 때마다 Slider의 값이 변경되며, 화면 중앙에는 Slider의 값이 표시됩니다.

플러터에서 Slider와 AppBar 위젯을 연동하는 방법을 살펴보았습니다.

더 많은 정보는 플러터 공식 문서에서 확인할 수 있습니다.