아빠와나 - slog

[dimohy]

아들과 단 둘이 대화를 나눌 수 있는 애플리케이션을 만드는 것을 목적으로 슬로그를 시작합니다.

필수 기능

모바일 앱이나 홈페이지, 윈도우 앱 형태 등 자유로운 형태로 대화 서비스를 이용할 수 있어야 함

전개

• Uno 플랫폼 사용
• DB 사용하지 않음
  • 아들과 대화할 것이므로 로그인에 필요한 정보는 파일 형태로 저장 함
  • 대화 내용도 파일로 저장
• Stl.Fusion을 이용해 실시간 기능 구현
• 최초 버젼은 일단 대화만 잘되도록 함.
• 화면 구성은 심플하되 깔끔하게 구현. 몇몇 디자인은 아들에게 맡김

필요 기술

• 메시지 실시간 수신 : Stl.Fusion
• 메시지 푸시 : Uno ?
• 인증 : ? (모바일 및 웹어셈블리, 윈도 애플리케이션)

코드명

DnSE (발음 덴스)

[dimohy]

화면 구성

스플래시 화면

(아들놈이 바꿀 것이므로 대충 만들었음)

인증 화면

대화 화면

[dimohy]

Uno 플랫폼 구성

https://platform.uno/docs/articles/get-started-vs-2022.html

기본 프로젝트 템플릿 실행 결과

윈도우

안드로이드

웹어셈블리

[aroooong]

오, 아드님과 재미난 프로젝트인거 같군요 !
좋아 보입니다
완성 되신 후 기회가 된다면 Flutter로 클론해보겠습니다.

(근데 이렇게 개인 slog에 중간 댓글로 이렇게 끼어들어도 되는건가요?.)

[dimohy]

네 그럼요. 개인 슬로그지만 다양한 참여를 환영합니다 ^^
그런데 10살짜리 아들에게 코딩 흥미를 유발하기 위한 프로젝트라… 대단한 것이 아닙니다. ^^;

[Nobody]

Uno 플랫폼을 사용하시는군요.
Uno 플랫폼을 사용해 보는 것만으로도 의미가 있을 거 같습니다.

[dimohy]

스플래시 스크린

플랫폼마다 스플래시 스크린을 보이는 방식이 다르기 때문에 완전 자동은 아닙니다.

먼저 스플래시 스크린으로 사용할 이미지를 Shared 프로젝트의 Assets 디렉토리에 SplashScreen.png로 배치합니다.

이제 이 이미지는 플랫폼 별도 접근이 되게 됩니다. 안드로이드의 경우 @drawable/assets_splashscreen로 접근이 되고 웹어셈블리의 경우 스플래시 이미지 경로가 Assets/SplashScreen.png로 되어 있기 때문에 바로 반영이 됩니다.

Windows의 경우에도 기본 설정되어 있습니다. (그런데 WinUI 3에서는 스플래시 화면이 뜨지는 않는군요…)

안드로이드의 경우 Styles.xml의 AppTheme 스타일에 다음을 추가해야 합니다.

...
<item name="android:windowSplashScreenAnimatedIcon">@drawable/assets_splashscreen</item>
...

그러면 시작할 때 잘은 보이는데 사이즈가 안맞게 출력되는군요.

스플래시 화면은 플랫폼 마다 사이즈가 다르므로 플랫폼 별로 준비하는것도 방법일 것 같습니다.

---

https://platform.uno/docs/articles/splash-screen.html?tabs=tabid-vswin

[dimohy]

테마

테마 시스템은 WinUI의 그것과 같습니다. 테마 자원은 ThemeResource로 접근할 수 있습니다.
현재 설정된 테마는 FrameworkElement 별 ActualTheme 속성으로 확인할 수 있고 RequestedTheme 속성으로 테마를 지정할 수 있습니다. RequestedTheme로 설정할 수 있는 테마는 Default, Light, Dark 입니다.

App.Current.RequestedTheme로 설정이 되면 좋은데요, 처음 앱이 시작할 때만 이 테마 설정이 적용되고 이후 변경하는것은 반영하지 않습니다.

그리고 윈도의 경우 Window.Current가 null입니다. 웹어셈블리나 안드로이드에서는 Window.Current로 적용해야만 테마가 적용됩니다. MainPage 인스턴스의 RequestedTheme 속성을 바꿔도 적용되지 않는데요, 그렇기 떄문에 다음의 코드를 통해 테마를 지정할 수 있습니다.

| MainPage.xaml, 테마 변경 토글

private void ToggleSwitch_Toggled(object sender, RoutedEventArgs e)
{
    var root = (FrameworkElement)Window.Current?.Content ?? this;
    root.RequestedTheme = themeToggleSwitch.IsOn is false ? ElementTheme.Light : ElementTheme.Dark;
}

테마 테스트 중…

[dimohy]

WinUI와의 호환성

Uno 플랫폼은 WinUI의 namespace를 그대로 사용합니다. WinUI를 100% 모두 완전히 지원하지는 않겠지만 이 말은 XAML부터 컨트롤, 세부 구현까지 UWP 및 WinUI 3의 기존 구현된 코드를 거의 그대로 가져다가 쓸 수 있다는 장점이 있습니다.
(물론 UWP 및 WinUI 3의 개발자가 생각보다 많지 않다는 점은 함점입니다. ㅡ.,ㅡ)

어쨌든 그래서 WinUI 개발자라면 Uno 플랫폼의 UI 작업에 허들이 없습니다. .NET Blazor에서 html및 css를 만져야 하는 고통이 있는 분은 Uno 플랫폼을 추천합니다.