3장 요약 텍스트 더 자세히 알아보기

  • 아티클

Download Sample 샘플 다운로드

참고 항목

이 책은 2016년 봄에 출간되었으며, 그 후로 업데이트되지 않았습니다. 이 책의 많은 내용이 지금까지도 무척 유용하나, 일부 내용은 오래되었고 올바르지 않거나 완전하지 않은 주제도 있습니다.

이 장에서는 색, 글꼴 및 서식을 포함하여 Label 보기를 자세히 살펴봅니다.

단락 줄 바꿈

Label의 Text 속성에 긴 텍스트가 포함된 경우 Label은 Baskervilles 샘플에서 설명한 대로 자동으로 여러 줄로 래핑합니다. em-dash의 경우 '\u2014'와 같은 유니코드 코드를 포함하거나 '\r'과 같은 C# 문자를 포함하여 새 줄로 나눌 수 있습니다.

Label의 HorizontalOptions 및 VerticalOptions 속성이 LayoutOptions.Fill로 설정된 경우 Label의 전체 크기는 해당 컨테이너가 사용할 수 있도록 설정된 공간에 의해 제어됩니다. Label은 제한되어 있습니다. Label의 크기는 해당 컨테이너의 크기입니다.

HorizontalOptions 및 VerticalOptions 속성이 LayoutOptions.Fill 이외의 값으로 설정된 경우 Label의 크기는 해당 컨테이너가 Label에 사용할 수 있는 크기까지 텍스트를 렌더링하는 데 필요한 공간에 의해 결정됩니다. Label은 제한되지 않는 것으로 간주되며 자체 크기를 결정합니다.

(참고: 제한 되지 않은 보기는 일반적으로 제한된 보기보다 작기 때문에 제한되고 제한되지 않은 용어는 직관적이지 않을 수 있습니다. 또한 이러한 용어는 책의 초기 장에서 일관되게 사용되지 않습니다.)

Label과 같은 보기는 한 차원에서는 제한될 수 있으며 다른 차원에서는 제한되지 않을 수 있습니다. Label은 가로로 제한된 경우에만 텍스트를 여러 줄로 줄 바꿈합니다.

Label이 제한되면 텍스트에 필요한 것보다 훨씬 많은 공간을 차지할 수 있습니다. 텍스트는 Label의 전체 영역 내에 배치할 수 있습니다. HorizontalTextAlignment 속성을 TextAlignment 열거형(Start, Center 또는 End)의 멤버로 설정하여 단락의 모든 줄의 맞춤을 제어합니다. 기본값은 Start이고 텍스트를 왼쪽에 맞춥니다.

VerticalTextAlignment 속성을 TextAlignment 열거형의 멤버로 설정하여 Label이 차지하는 영역의 위쪽, 중앙 또는 아래쪽에 텍스트를 배치합니다.

LineBreakMode 속성을 LineBreakMode 열거형의 멤버(WordWrap, CharacterWrap, NoWrap, HeadTruncation, MiddleTruncation 또는 TailTruncation)로 설정하여 단락의 여러 줄이 줄 바꿈되는 방식을 제어합니다.

텍스트 및 배경색

Label의 TextColor 및 BackgroundColor 속성을 Color 값으로 설정하여 텍스트 및 배경색을 제어합니다.

BackgroundColor는 Label이 차지하는 전체 영역의 배경에 적용됩니다. HorizontalOptions 및 VerticalOptions 속성에 따라 해당 크기는 텍스트를 표시하는 데 필요한 영역보다 훨씬 클 수 있습니다. 색을 통해 HorizontalOptions, VerticalOptions, HorizontalExeAlignment 및 VerticalTextAlignment의 다양한 값을 실험하여 Label의 크기와 위치 및 Label 내의 텍스트 크기와 위치에 미치는 영향을 확인할 수 있습니다.

색 구조

Color 구조를 사용하면 색을 RGB(빨강-녹색-파랑) 값 또는 HSL(색상-채도-광도) 값으로 지정하거나 색 이름을 지정할 수 있습니다. 알파 채널을 사용하여 투명성을 나타낼 수도 있습니다.

Color 생성자를 사용하여 다음 사항을 지정합니다.

인수는 0에서 1 사이의 double 값입니다.

여러 정적 메서드를 사용하여 Color 값을 만들 수도 있습니다.

  • 0에서 1 사이의 double RGB 값의 경우 Color.FromRgb
  • 0에서 255 사이의 정수 RGB 값의 경우 Color.FromRgb
  • 투명도가 있는 double RGB 값의 경우 Color.FromRgba
  • 투명도가 있는 정수 RGB 값의 경우 Color.FromRgba
  • 투명도가 있는 double HSL 값의 경우 Color.FromHsla
  • Color.FromUint 로 계산된 값의 uint 경우(B + 256 * (G + 256 * (R + 256 * A))
  • "#AARRGGBB", "#RRGGBB", "#ARGB" 또는 "#RGB" 형식의 16진수 string 형식의 경우 Color.FromHex의 각 문자는 알파, 빨강, 녹색 및 파랑 채널의 16진수에 해당합니다. 이 메서드는 7장, XAML 및 코드에 설명된 대로 XAML 색 변환에 기본적으로 사용됩니다.

만든 후에는 Color 값을 변경할 수 없습니다. 다음 속성에서 색의 특성을 가져올 수 있습니다.

이들은 모두 0에서 1 사이의 double 값입니다.

Color는 공용 색에 대해 240개의 공용 정적 읽기 전용 필드를 정의합니다. 책이 작성될 때에는 17개의 공통 색만 사용할 수 있습니다.

다른 공용 정적 읽기 전용 필드는 모든 색 채널이 0으로 설정된 색을 정의합니다.

여러 인스턴스 메서드를 통해 기존 색을 수정하여 새 색을 만들 수 있습니다.

마지막으로, 두 정적 읽기 전용 속성은 특수 색 값을 정의합니다.

Color.Default는 플랫폼의 색 구성표를 적용하기 위한 것이며, 그에 따라 다양한 플랫폼의 다른 컨텍스트에서 의미를 갖습니다. 기본적으로 플랫폼 색 구성표는 다음과 같습니다.

  • iOS: 밝은 배경의 어두운 텍스트
  • Android: 어두운 배경의 밝은 텍스트(책에서) 또는 밝은 배경의 어두운 텍스트(샘플 코드 리포지토리의 기본 분기에서 AppCompat을 통한 재질 디자인의 경우)
  • UWP: 밝은 배경의 어두운 텍스트

Color.Accent 값은 어둡거나 밝은 배경에 표시되는 플랫폼별(때로는 사용자가 선택할 수 있음) 색을 생성합니다.

애플리케이션 색 구성표 변경

위의 목록에 표시된 것처럼 다양한 플랫폼에는 기본 색 구성표가 있습니다.

Android를 대상으로 하는 경우에는 Android.Manifest.xml 파일에서 밝은 테마를 지정하여 어두운 조명 구성표로 전환할 수 있습니다.

Windows 플랫폼의 경우 색 테마는 일반적으로 사용자가 선택하지만 플랫폼의 App.xaml 파일에서 Light 또는 Dark에 RequestedTheme 특성 집합을 추가할 수 있습니다. 기본적으로 UWP 프로젝트의 App.xaml 파일에는 Light로 설정된 RequestedTheme 특성이 포함되어 있습니다.

글꼴 크기 및 특성

Label의 FontFamily 속성을 "Times Roman" 등의 문자열로 설정하여 글꼴 패밀리를 선택합니다. 그러나 특정 플랫폼에서 지원되는 글꼴 패밀리를 지정해야 하며, 이러한 측면에서 플랫폼이 일치하지 않습니다.

글꼴의 대략적인 높이를 지정하려면 Label의 FontSize 속성을 double로 설정합니다. 글꼴 크기를 지능적으로 선택하는 방법에 대한 자세한 내용은 5장, 크기 처리를 참조하세요.

또는 미리 설정된 여러 플랫폼 종속 글꼴 크기 중 하나를 가져올 수 있습니다. 정적 Device.GetNamedSize 메서드와 오버로드 모두 열거형(Default, Micro, SmallMedium및Large)의 NamedSize 멤버에 따라 플랫폼에 적합한 글꼴 크기 값을 반환 double 합니다. Medium 멤버에서 반환된 값은 Default와 동일할 필요는 없습니다. NamedFontSizes 샘플은 이러한 명명된 크기의 텍스트를 표시합니다.

Label의 FontAttributes 속성을 이러한 FontAttributes 열거형인 Bold, Italic 또는 None 멤버로 설정합니다. Bold 및 Italic 멤버를 C# OR 연산자와 결합할 수 있습니다.

서식 있는 텍스트

지금까지의 모든 예제에서 Label이 표시되는 전체 텍스트의 형식이 균일하게 지정되었습니다. 텍스트 문자열 내에서 서식을 변경하려면 Label의 Text 속성을 설정하지 마세요. 대신 FormattedText 속성을 FormattedString 형식의 개체로 설정하세요.

FormattedString에는 Span 개체의 컬렉션인 Spans 속성이 있습니다. 각 Span 개체에는 고유한 Text, FontFamily, FontSize, FontAttributes, ForegroundColor 및 BackgroundColor 속성이 있습니다.

VariableFormattedText 샘플은 한 줄의 텍스트에 대해 FormattedText 속성을 사용하는 방법을 보여주고, VariableFormattedParagraph는 다음과 같이 전체 단락에 대한 기술을 보여줍니다.

Triple screenshot of variable formatted paragraph

NamedFontSizes 프로그램은 단일 Label 및 FormattedString 개체를 사용하여 각 플랫폼에 대해 명명된 글꼴 크기를 모두 표시합니다.