[Flutter] TextField안의 상단에 prefix 넣기

TextField안의 상단에 prefix 넣기

custom_form_field.dart

import 'package:flutter/material.dart';

import '../constants.dart';

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

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        TextFormField(
            textAlignVertical: TextAlignVertical.bottom,
            decoration: InputDecoration(
                contentPadding: EdgeInsets.only(top: 30, left: 20, bottom: 10),
                hintText: "근처 추천 장소",
                border: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(10),
                ))),
        Positioned(
          left: 20,
          top: 8,
          child: Text(
            "위치",
            style: kTextFormBody2Style,
          ),
        ),
      ],
    );
  }
}

설명

Stack안에 

TextFormField를 디자인하고 

position을 통해 prefix를 디자인 해준다.