[flutter] 플러터 LinearLoader의 로딩 속도 조절 방법

11 Dec 2023

flutter

플러터 앱에서 사용되는 LinearLoader의 로딩 속도를 조절하는 방법에 대해 알아보겠습니다.

LinearLoader란?

LinearLoader는 플러터 앱에서 데이터를 불러오거나 처리할 때 사용되는 로딩 인디케이터로, 사용자에게 작업이 진행 중임을 시각적으로 표시해 줍니다.

로딩 속도 조절 방법

로딩 속도를 조절하기 위해선 LinearProgressIndicator 위젯에서 value 속성을 조절하면 됩니다. 이 속성은 로딩 진행 정도를 나타내는 값으로, 0.0에서 1.0 사이의 값을 가집니다.

로딩이 시작될 때에는 value를 null 또는 0.0으로 초기화하고, 작업이 진행됨에 따라 해당 값이 증가하도록 설정합니다.

아래는 LinearProgressIndicator를 이용한 간단한 예시 코드입니다.

import 'package:flutter/material.dart';

class MyLinearLoader extends StatefulWidget {
  @override
  _MyLinearLoaderState createState() => _MyLinearLoaderState();
}

class _MyLinearLoaderState extends State<MyLinearLoader> {
  double _progressValue = 0.0;

  @override
  void initState() {
    super.initState();
    _startLoading();
  }

  void _startLoading() {
    // Assume that the loading process takes 5 seconds
    Future.delayed(Duration(seconds: 5), () {
      setState(() {
        _progressValue = 1.0;
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: LinearProgressIndicator(
        value: _progressValue,
      ),
    );
  }
}

위 코드에서 _progressValue를 적절히 변경하여 로딩 속도를 조절할 수 있습니다.

결론

플러터 앱에서 LinearLoader의 로딩 속도를 조절하는 방법에 대해 알아보았습니다. LinearProgressIndicator의 value 속성을 활용하여 로딩 진행 상황을 효과적으로 표시할 수 있습니다.

참고문헌: