[Flutter] how to use TextField

쏘리초이·2020λ…„ 11μ›” 13일
0

πŸ“TextField μ‚¬μš©λ²•

 child: TextField(
    textAlignVertical: TextAlignVertical.center,
    controller: searchTextController,
    style: TextStyle(),
    
    /// ν‚€λ³΄λ“œ λͺ¨μ–‘
    textInputAction: TextInputAction.search,
    decoration: InputDecoration(
        contentPadding: const EdgeInsets.all(0),

        /// 바탕화면 색
        filled: true,
        fillColor: Colors.white,

        /// ν¬μ»€μŠ€λμ„λ•Œ, 밑에 border
        border: InputBorder.none,

        /// Border
        enabledBorder: OutlineInputBorder(
          borderRadius:
              BorderRadius.all(Radius.circular(50.0)),
          borderSide:
              BorderSide(color: Colors.white, width: 2),
        ),
        focusedBorder: OutlineInputBorder(
          borderRadius:
              BorderRadius.all(Radius.circular(50.0)),
          borderSide: BorderSide(color: Colors.white),
        ),

        /// Textfield μ•ˆμ—μ„œ 였λ₯Έμͺ½μ— μžˆλŠ” icon
        suffixIcon: 
              SizedBox(
                height: 20,
                width: 20,
                child: IconButton(
                  key: Key(JoaraKeys.clearBtn),
                  padding: new EdgeInsets.all(0.0),
                  onPressed: () =>
                      searchTextController.clear(),
                  icon: Icon(
                    Icons.timesCircle,
                    size: 16,
                  ),
                ),
              ),

        /// TextField μ•ˆμ—μ„œ μ™Όμͺ½μ— μžˆλŠ” icon
        prefixIcon: SizedBox(
          height: 30,
          width: 30,
          child: IconButton(
            padding: new EdgeInsets.all(0.0),
            onPressed: () {},
            icon: Icon(
              Icons.search,
              size: 24,
            ),
          ),
        ),
        hintText:'Search'),

    /// Textfield done ν΄λ¦­ν–ˆμ„λ•Œ
    onSubmitted: (text) {

    },

    /// Textfield ν΄λ¦­ν–ˆμ„λ•Œ
    onTap: () {
     
    },
  ),
),

0개의 λŒ“κΈ€