-
카테고리
-
세부 분야
모바일 앱 개발
-
해결 여부
미해결
안녕하세요. 강의를 들으면서 앱을 제작하다 여쭤볼게 있어 질문드립니다.
19.05.30 12:08 작성 조회수 562
0
안녕하세요 현재 flutter를 이용하여 앱을 제작 중인 상태입니다.
개발 중 해결이 안되는 부분이 있어서 질문을 드립니다.
현재 앱을 개발하면서 fontsize를 14를 기본 폰트 사이즈로 잡고 앱을 개발 중입니다.
그런데 안드로이드에서 사용 시 안드로이드 디바이스 글자크기 설정을 아주크게로 해놓을 경우
플러터로 제작한 앱 내의 폰트도 영향을받아 글씨가 너무 커져버립니다.
그래서 글자가 다 잘려나오는 상태입니다...
외부의 글자크기 설정을 관여받지 않거나 앱 내에서 고정 폰트를 사용할 수 있는 방법 등을 찾아
앱 에서 나오는 폰트는 크기 변동을 없이 사용하고 싶은데 해결 방법이 있을까해서 한번 여쭤봅니다.
또한 textScaleFactor 함수는 어떠한 기능을 하는지 좀 알고 싶은데 알고 계실까요?
웹 서치를 하다보니 textScaleFactor로 폰트의 사이즈를 고정할 수 있다는 외국 글이 있는데
좀 사용해본 결과로는 배율 움직임 밖에는 되지 않는 것 같아 좀 더 지식이 있으신 전문가 분께 한 번 여쭤봅니다.
두서 없는 질문 이지만 꼭 문제를 해결하고 싶기에 답변 부탁드립니다.
좋은 강의 올려주셔서 정말 너무 잘 듣고 있습니다.
답변을 작성해보세요.
0
오준석
지식공유자2019.06.05
상속을 받아도 생성자를 그대로 가져오지 않아서 그렇습니다. 예제로 Text속성 다 받을 수 있게 했고요. 생성자에 중괄호 { } 안의 것들은 옵션으로 설정할 수 있는 것들이 됩니다.
class CustomText extends Text {
CustomText(
String data, {
Key key,
style,
strutStyle,
textAlign,
textDirection,
locale,
softWrap,
overflow,
maxLines,
semanticsLabel,
}) : super(data,
key: key,
style: style,
strutStyle: strutStyle,
textAlign: textAlign,
textDirection: textDirection,
locale: locale,
softWrap: softWrap,
overflow: overflow,
maxLines: maxLines,
semanticsLabel: semanticsLabel,
textScaleFactor: 1.0);
}
...
사용예
CustomText('글자 테스트', style: TextStyle(color: Colors.red),)
CustomText('글자 테스트')
0
Hee-sung Moon
질문자2019.06.05
알려주신 형식을 사용하다가 궁굼한 점이 있어서 하나 여쭤보려고 합니다...
현재
class CustomText extends Text {
final int fontSize;
CustomText(String data, this.fontSize, ): super(data, textScaleFactor: 1.0);
}
이렇게 클래스를 만들고 다른 페이지에서 import 시켜서
Positioned(
left: 16 / 3,
top: 36 / 3,
child: CustomText(userData.memTitle, 20,
style: TextStyle(color:Color(0xFFa6093d),
fontWeight: FontWeight.bold)
),
),
이런 형식으로 받아서 사용을 하고 있습니다.
그런데
style 파라미터가 정의 되지 않았다는 에러로 run이 안되는데
어떤 형식으로 style을 정의해줘야 하는지 좀 알 수 있을까요?...
0
0
오준석
지식공유자2019.06.04
네. textScaleFactor는 Text 속성이기 때문에 StatelessWidget에서는 사용 불가능합니다. 그래서 Text를 상속하시라고 말씀드린 거에요.
별도 파일에 CustomText 만들어 두시고 다른곳에서 import 해서 사용하시면 재사용이 가능하지요.
0
Hee-sung Moon
질문자2019.06.04
자세한 설명 감사합니다.
아래 알려주신 코드를 똑같이 새 dart페이지에 작성해서 해볼땐 되는데
제가 참조 소스첨부에 사용하고 있는 CustomText 클래스에 넣어 사용하려고하니 안되서요...
혹시 StatelessWidget에서는 textScaleFactor가 사용이 불가한걸까요?
0
오준석
지식공유자2019.06.04
위에 제가 작성해 드린 코드를 그대로 쓰시면 됩니다. 추가적으로 필요한 속성은 super 쪽 생성자에 추가하시면 됩니다.
예시입니다.
import 'package:flutter/material.dart';
class MyMediaQuery extends StatefulWidget {
@override
_MyMediaQueryState createState() => _MyMediaQueryState();
}
class _MyMediaQueryState extends State<MyMediaQuery> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('MediaQuery'),
),
body: Center(
child: CustomText('글자 테스트'),
),
);
}
}
class CustomText extends Text {
CustomText(String data) : super(data, textScaleFactor: 1.0);
}
0
Hee-sung Moon
질문자2019.06.04
답변 너무 감사합니다.
그럼 CustomText로 class만든 부분에 추가를 해야하는 건가요?
아님 별도로
class CustomText extends Text { }를 만들어 써야하는 걸까요?...
0
오준석
지식공유자2019.06.03
기존 Text를 상속 받는 것이 좋을 것 같네요. 다음과 같이 작성해서 동작하는 걸 확인했습니다.
class CustomText extends Text {
CustomText(String data) : super(data, textScaleFactor: 1.0);
}
0
Hee-sung Moon
질문자2019.06.03
안녕하세요...
며칠 전에 답변 주신 textScaleFactor를 활용해서 항상 Text를 보통 크기로 유지하고 싶어서 진행해 봤는데
생각보다 적용하기가 힘들어서 다시 문의드리고자 합니다...
위에 알려주신 방법을 토대로 Text 코드만 사용하여 작성했을때는 textScaleFactor가 적용되는 것을 확인하였는데
저 같은 경우는 Text에 대한 Class 함수를 만들어 위젯형식으로 적용을 시켜 전체적으로 Text에대해 이펙트를 먹이고 있습니다.
그런데 아래의 소스에 textScaleFactor를 사용했을때는 에러가 나서
어떻게 적용해야 하는지 좀 도움을 받을 수 있을까해서 문의 남깁니다..
너무 자주 여쭤봐서 죄송합니다 ㅜ
플러터가 처음이다보니 어려움이 많네요...
-----소스첨부----
class CustomText extends StatelessWidget {
final String text;
final int fontSize;
final Color color;
final double height;
final FontWeight fontWeight;
CustomText(this.text, this.fontSize,
{Key key,
this.color = const Color(0xFF434343),
this.height = 1.0,
this.fontWeight = FontWeight.normal})
: super(key: key);
@override
Widget build(BuildContext context) {
return Text(
this.text,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontFamily: 'NanumGothic',
fontSize: this.fontSize.toDouble(),
color: this.color,
height: this.height,
fontWeight: this.fontWeight,
),
);
}
}
——중간생략——
Row(
children: <Widget>[
InkWell(
child: Container(
width: drawerWidth,
height: 120 / 3,
child: Row(
children: <Widget>[
Padding(
padding:
const EdgeInsets.only(left: 50 / 3, right: 44 / 3),
child: Image.asset(
'assets/images/Side_Menu_Monitoring_Btn.png',
width: 66 / 3,
height: 66 / 3,
fit: BoxFit.fill,
),
),
CustomText('Monitoring', 16,
color: Color(0xFF355c7d), fontWeight: FontWeight.bold),
],
)),
onTap: () {
Navigator.pop(context);
Navigator.pushReplacement(
context,
MaterialPageRoute(
builder: (context) => new MonitoringPage()));
},
),
],
0
오준석
지식공유자2019.05.31
Text(
'Text',
textScaleFactor: 1.0,
),
로 설정하면 됩니다.
Text 위젯은 기본으로 textScaleFactor 값이 기기의 폰트 크기에 따라 설정됩니다. 이 값을 폰트 크기에 곱해서 크기가 결정되는 듯 하고 그 값은 MediaQuery를 통해 얻을 수도 있어요.
제가 아래 코드로 기기의 폰트 설정을 바꿔 가면서 테스트 해 보니
작게 : 0.85, 보통 : 1.0, 크게 : 1.15, 가장 크게 : 1.3 으로 나옵니다.
Text(
'${MediaQuery.of(context).textScaleFactor}'
)
그래서 textScaleFactor 값을 강제로 1.0 으로 주게 되면 항상 보통 크기로 보이게 됩니다.
덕분에 저도 알아가네요.
0
0
답변 12