I would like to be able to change the Fontfamily when I press the ElevatedButton in flutter

Question

I want the Textfield and the fontFamily in the picture at the top to change when the ElevatedButton is pressed. What should I do? I want to try GetX.

home_page.dart

ListView(
  scrollDirection: Axis.horizontal,
 children: [
      FontFamilyWidget(
             fontFamily: 'Cafe24SsurroundAir',
             buttonName: '✈️ 카페24 써라운드 에어'),
             const SizedBox(width: 5),
      FontFamilyWidget(
             fontFamily: 'RIDIBatang', buttonName: ' 리디바탕'),
             const SizedBox(width: 5),
      FontFamilyWidget(
             fontFamily: 'InkLipquid', buttonName: ' 잉크립퀴드체'),
             const SizedBox(width: 5),
              .
              .
              .

fontfamily_widget.dart

Answer 1

part of 'font_controller.dart'

 String select = 'RIDIBatang';

  void onClickChangeFont(String changedFontFamily) {
    select = changedFontFamily;
    update();
  }

part of 'fontfamily_widget.dart'

class FontFamilyWidget extends StatefulWidget {
  final String fontFamily;
  final String buttonName;
  final String changedFontFamily;

  const FontFamilyWidget({
    Key? key,
    required this.fontFamily,
    required this.buttonName,
    required this.changedFontFamily,
  }) : super(key: key);

  @override
  _FontFamilyWidgetState createState() => _FontFamilyWidgetState();
}

class _FontFamilyWidgetState extends State<FontFamilyWidget> {
  FontController c = Get.find();

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      //텍스트필드와 상단 텍스트의 fontfamily를 변경해주는 함수
      onPressed: () {
        c.onClickChangeFont(widget.changedFontFamily);
      },

      child: Text(
        widget.buttonName,
        style: TextStyle(fontFamily: widget.fontFamily),
      ),
    );
  }
}

After that, FontFamilyWidget was applied to home_page.dart.