이미지를 로드하고 캐싱하는 데 사용되는 cached_network_image 패키지는 가장 인기 있는 Flutter 이미지 로딩 패키지 중 하나입니다. 여기에는 CachedNetworkImage 위젯이 포함되어 있습니다. 이 위젯을 사용하여 원격 이미지를 로드하고 가운데 정렬하는 방법에 대해 알아봅시다.

1. cached_network_image 패키지 추가

먼저, pubspec.yaml 파일에 cached_network_image 패키지를 추가합니다.

dependencies:
  cached_network_image: any

pubspec.yaml 파일에 패키지를 추가한 후에는 터미널에서 flutter pub get 명령을 실행하여 패키지를 다운로드합니다.

2. CachedNetworkImage 사용하기

다음으로, CachedNetworkImage 위젯을 사용하여 이미지를 가운데 정렬합니다.

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

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: CachedNetworkImage(
        imageUrl: 'https://example.com/image.jpg',
        placeholder: (context, url) => CircularProgressIndicator(),
        errorWidget: (context, url, error) => Icon(Icons.error),
      ),
    );
  }
}

위의 예제에서 CachedNetworkImage 위젯은 Center 위젯 안에 있으므로 이미지가 화면 가운데에 정렬됩니다. imageUrl 속성을 통해 이미지 URL을 지정하고, placeholder 및 errorWidget 속성을 사용하여 로딩 중 및 에러 상태에 대한 위젯을 지정할 수 있습니다.

이제 cached_network_image 패키지를 사용하여 Flutter 앱에서 이미지를 가운데 정렬하는 방법을 알게 되었습니다.