[Flutter] 중복되는 것 없이 새로운 함수로 Icon받기

Expanded(
         child: Slider(
        	 value: currentPosition.inSeconds.toDouble(),
  	    	 onChanged: (double val) {
           		 videoController!.seekTo(Duration(seconds: val.toInt(),
                    ),
                 );
              },
              max: videoController!.value.duration.inSeconds.toDouble(),
              min: 0,
             ),
           ),​

class _Controls extends StatelessWidget {
  const _Controls({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        IconButton(
          onPressed: () {},
          iconSize: 30.0,
          color: Colors.white,
          icon: Icon(
              Icons.play_arrow
          ),
        ),
      ],
    );
  }

 

 

children에 Icon을 중복을 걸러서 하나의 함수로 만들고 싶을 때

 

 

 

  Widget renderIconButton({
    required VoidCallback onPressed,
    required IconData iconData, // 실제로 들어가는 Icons의 클래스가 IconData
}) {

  }
}

 

 

 

  Widget renderIconButton({
    required VoidCallback onPressed,
    required IconData iconData, // 실제로 들어가는 Icons의 클래스가 IconData
  }) {
    return IconButton(
      onPressed: onPressed,
      iconSize: 30.0,
      color: Colors.white,
      icon: Icon(
        iconData,
      ),
    );
  }
}

 

 

class _Controls extends StatelessWidget {
  const _Controls({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        renderIconButton(
            onPressed: (){},
            iconData: Icons.rotate_left,
        ),
        renderIconButton(
          onPressed: (){},
          iconData: Icons.play_arrow,
        ),
        renderIconButton(
          onPressed: (){},
          iconData: Icons.rotate_right,
        ),
      ],
    );
  }

 

 

컨트롤러는 Stateful위젯에 state있으니까

버튼을 눌렀을 때(icon버튼) 기능들을 state로 올려줘야한다.

pressed의 기능들을 파라미터로 넣어줘야 한다.

 

 

state에서 함수를 받고, 함수는 외부에 따로 설정해서 불러오는 형식

(주의 함수는 state함수 밖이 아니라 안에서 정의, stless는 아예 밖)

 

 

import 'dart:io';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';
import 'package:video_player/video_player.dart';

class CustomVideoPlayer extends StatefulWidget {
  final XFile video;

  const CustomVideoPlayer({required this.video, Key? key}) : super(key: key);

  @override
  State<CustomVideoPlayer> createState() => _CustomVideoPlayerState();
}

class _CustomVideoPlayerState extends State<CustomVideoPlayer> {
  VideoPlayerController? videoController;

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

  initializeController() async {
    videoController = VideoPlayerController.file(
      File(widget.video.path), 
    );
    await videoController!.initialize();

    setState(() {
    });
  }

  @override
  Widget build(BuildContext context) {
    if (videoController == null) {
      return CircularProgressIndicator();
    }
    return AspectRatio(
        aspectRatio: videoController!.value.aspectRatio,
        child: Stack(
          children: [
            VideoPlayer(videoController!),
            _Controls(
              onReversePressed: onReversePressed,
              onPlayPressed: onPlayPressed,
              onForwardPressed: onForwardPressed,
              isPlaying: videoController!.value.isPlaying,
            ),
            Positioned(
              right: 0,
              child: IconButton(
                  onPressed: (){},
                  color: Colors.white,
                  iconSize: 30.0 ,
                  icon: Icon(Icons.photo_camera_back)
              ),
            ),
          ],
        )
    );
  }
  void onReversePressed() {

  }
  void onPlayPressed() {
    
  }
  void onForwardPressed() {
    
  }
}

class _Controls extends StatelessWidget {
  final VoidCallback onPlayPressed;
  final VoidCallback onReversePressed;
  final VoidCallback onForwardPressed;
  final bool isPlaying;

  const _Controls({
    required this.onPlayPressed,
    required this.onReversePressed,
    required this.onForwardPressed,
    required this.isPlaying,
    Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      color: Colors.black.withOpacity(0.5),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          renderIconButton(
              onPressed: onReversePressed,
              iconData: Icons.rotate_left,
          ),
          renderIconButton(
            onPressed: onPlayPressed,
            iconData: isPlaying ? Icons.pause : Icons.play_arrow,
          ),
          renderIconButton(
            onPressed: onForwardPressed ,
            iconData: Icons.rotate_right,
          ),
        ],
      ),
    );
  }

  Widget renderIconButton({
    required VoidCallback onPressed,
    required IconData iconData, // 실제로 들어가는 Icons의 클래스가 IconData
  }) {
    return IconButton(
      onPressed: onPressed,
      iconSize: 30.0,
      color: Colors.white,
      icon: Icon(
        iconData,
      ),
    );
  }
}