sihoo
edf0444b71
- 프로필 꾸미기: 미리보기 중인 큰 타일의 테두리도 테마 색으로 바뀌게 수정, 미구매 템플릿에 "체험하기" 버튼을 따로 둬서 사기 전에도 눌러볼 수 있게 함 - 앱 전반의 확인/삭제/저장 같은 다이얼로그 기본 액션 버튼에 autofocus를 줘서 엔터 키로도 눌리게 함 (텍스트 입력이 있는 다이얼로그는 입력창 쪽에 autofocus + onSubmitted를 달아 입력 중 바로 엔터로 제출되게 처리) - HoldToRevealPasswordField 위젯 추가 - 눈 아이콘을 누르고 있는 동안만 비밀번호가 평문으로 보임. 로그인/간편인증/초기 비밀번호 변경 화면에 적용
68 lines
2.1 KiB
Dart
68 lines
2.1 KiB
Dart
// 👁️ 비밀번호 입력창 - 오른쪽 눈 아이콘을 누르고 있는 동안만 평문으로 보여준다.
|
|
// 토글형(눌러서 계속 보기) 대신 "홀드"로 만든 이유: 손을 떼는 순간 바로 다시 가려져서
|
|
// 누가 옆에서 보더라도 짧게 확인만 하고 끝낼 수 있다.
|
|
import 'package:flutter/material.dart';
|
|
|
|
class HoldToRevealPasswordField extends StatefulWidget {
|
|
final TextEditingController controller;
|
|
final String labelText;
|
|
final String? hintText;
|
|
final IconData prefixIcon;
|
|
final bool autofocus;
|
|
final TextInputType? keyboardType;
|
|
final TextInputAction? textInputAction;
|
|
final ValueChanged<String>? onSubmitted;
|
|
|
|
const HoldToRevealPasswordField({
|
|
super.key,
|
|
required this.controller,
|
|
required this.labelText,
|
|
this.hintText,
|
|
this.prefixIcon = Icons.lock,
|
|
this.autofocus = false,
|
|
this.keyboardType,
|
|
this.textInputAction,
|
|
this.onSubmitted,
|
|
});
|
|
|
|
@override
|
|
State<HoldToRevealPasswordField> createState() =>
|
|
_HoldToRevealPasswordFieldState();
|
|
}
|
|
|
|
class _HoldToRevealPasswordFieldState extends State<HoldToRevealPasswordField> {
|
|
bool _revealed = false;
|
|
|
|
void _setRevealed(bool value) {
|
|
if (_revealed != value) setState(() => _revealed = value);
|
|
}
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return TextField(
|
|
controller: widget.controller,
|
|
obscureText: !_revealed,
|
|
autofocus: widget.autofocus,
|
|
keyboardType: widget.keyboardType,
|
|
textInputAction: widget.textInputAction,
|
|
onSubmitted: widget.onSubmitted,
|
|
decoration: InputDecoration(
|
|
labelText: widget.labelText,
|
|
hintText: widget.hintText,
|
|
border: const OutlineInputBorder(),
|
|
prefixIcon: Icon(widget.prefixIcon),
|
|
suffixIcon: GestureDetector(
|
|
behavior: HitTestBehavior.opaque,
|
|
onTapDown: (_) => _setRevealed(true),
|
|
onTapUp: (_) => _setRevealed(false),
|
|
onTapCancel: () => _setRevealed(false),
|
|
child: Icon(
|
|
_revealed ? Icons.visibility_rounded : Icons.visibility_off_rounded,
|
|
color: Colors.grey,
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|