본문 바로가기

언리얼/라이라 프레임워크로 오버워치 만들기11

[UE5 라이라(Lyra) 샘플로 오버워치 만들기] 11. 크레딧 화면에 액션 버튼 추가하기(2) 안녕하세요. 오늘은 지난 시간에 이어 크레딧 화면에 슬로우 / 패스트 버튼 기능을 구현해보겠습니다.Lyra의 CommonUI 시스템을 활용하여 인풋 액션 바인딩을 직접 다뤄볼 좋은 기회죠.이번 시간의 목표는 아래와 같습니다:크레딧 위젯을 커스터마이징하고슬로우/패스트 기능을 구현한 후인풋 액션 바인딩을 활용해 액션 바에 버튼 표시까지 완성하는 것입니다.1. 위젯 부모 클래스 변경먼저, 저번 시간에 만든 UJHCreditScreen 클래스를 W_Credits 위젯의 부모 클래스로 지정해줍니다.위젯입니다. ✅ 방법:W_Credits 위젯 열기상단 메뉴 → Class Settings 클릭오른쪽 Details 패널 → Parent Class → JHCreditScreen으로 변경 이제부터 이 위젯은 우리가 만든 .. 2025. 6. 30.
[UE5 라이라(Lyra) 샘플로 오버워치 만들기] 10. 크레딧 화면에 액션 버튼 추가하기(1) 언리얼 Lyra 프로젝트에 크레딧 화면 액션 버튼 추가하기이번 시간에는 크레딧 위젯에 액션 버튼을 추가해서 유저가 크레딧을 느리게 재생하거나 빠르게 스킵할 수 있도록 기능을 구현해보겠습니다.기능 자체는 단순하지만, Lyra의 CommonUI 시스템을 활용한 인풋 바인딩 방식을 경험할 수 있는 좋은 예제입니다. 1. 새로운 크레딧 화면 클래스 만들기 먼저 ULyraActivatableWidget을 상속받는 C++ 클래스 UJHCreditScreen을 하나 생성해줍니다.위치는 UI 폴더로 두는 것이 좋습니다. 2. 헤더에 멤버 변수 및 함수 정의🧩 헤더 변수 선언:protected: UPROPERTY(EditDefaultsOnly) FDataTableRowHandle BackInputActionData;.. 2025. 6. 23.
[UE5 라이라(Lyra) 샘플로 오버워치 만들기] 9. 설정 UI 바꾸기(3) Lyra 세팅 UI 커스터마이징 - ListEntry와 디테일 패널 텍스트 수정지난 시간에 List Entry와 디테일 패널 텍스트를 수정했었는데, 적용이 덜 된 부분이 있었습니다.이번 시간에는 이 부분을 완전히 정리해보겠습니다! W_SettingsPanel 살펴보기먼저 W_SettingsPanel 위젯을 열어 어떤 리스트가 표시되는지 확인해봅니다.ListView_Settings를 보면,GameSettingRegistryVisuals 라는 DataAsset을 사용하는 것을 알 수 있습니다.즉, 리스트에 표시되는 Entry 위젯들은 이 GameSettingRegistryVisuals에서 관리되고 있습니다. GameSettingRegistryVisuals 분석 GameSettingRegistryVisuals.. 2025. 6. 16.
[UE5 라이라(Lyra) 샘플로 오버워치 만들기] 8. 설정 UI 바꾸기(2) Lyra 세팅 UI 커스터마이징 (2) - 패널 텍스트 수정하기지난 시간에 이어서 이번에는 세팅 패널의 텍스트를 수정해보겠습니다.기존에는 배경과 텍스트 모두 밝은 색이라,글자가 잘 보이지 않는 문제가 있었죠.오늘은 이 문제를 해결해보겠습니다! 1. 리스트 엔트리 백그라운드 수정먼저 W_SettingsPanel 위젯으로 갑니다.ListView_Settings를 확인해보니 Entry Widget Class가 W_SettingsListEntry_Missing으로 설정되어 있었습니다. 👉 이 W_SettingsListEntry_Missing 위젯을 수정해주겠습니다. W_SettingsListEntry_Missing 위젯 살펴보기구조를 보면, 백그라운드는Background 위젯 안에 있는W_SettingEn.. 2025. 6. 9.
[UE5 라이라(Lyra) 샘플로 오버워치 만들기] 7. 설정 UI 바꾸기(1) Lyra 세팅 UI 커스터마이징 해보기이번 시간에는 Lyra 샘플 프로젝트의 Setting UI를 커스터마이징해보겠습니다. Setting UI는 어디에 있을까?먼저, W_LyraFrontEnd 블루프린트를 살펴보면,"설정" 버튼을 누를 때 W_LyraSettingScreen 위젯이 Push되는 것을 확인할 수 있습니다.그래서 이번 작업의 메인 대상은 W_LyraSettingScreen 위젯입니다. W_LyraSettingScreen 위젯 W_LyraSettingScreen 수정하기W_LyraSettingScreen 위젯은 대략 이런 구조를 가지고 있습니다.1. 세팅 탭(Tab) 정렬 변경TabSZ를 **좌측 정렬(Left Align)**로 변경했습니다. 먼저 세팅 탑 탭을 먼저 수정해보겠습니다. TabS.. 2025. 6. 3.
[UE5 라이라(Lyra) 샘플로 오버워치 만들기] 6. 플레이 선택 UI 바꾸기 플레이 버튼 UI 커스터마이징하기오늘은 언리얼 엔진 프로젝트에서 플레이 버튼을 눌렀을 때 등장하는 UI를 커스터마이징해보겠습니다. 플레이 버튼을 누르면 어떤 UI가 나올까?플레이 버튼을 클릭하면, W_ExperienceSelectionScreen 위젯이 UI.Layer.Menu에 Push되는 구조로 되어있습니다.따라서 우리가 수정할 대상은 W_ExperienceSelectionScreen 위젯입니다. W_ExperienceSelectionScreen 위젯 W_ExperienceSelectionScreen 위젯은 다음과 같은 구조로 되어 있습니다.전체적인 구성은 이미 완성되어 있기 때문에, 이번에는 텍스트와 폰트 스타일 위주로 변경을 진행합니다. 수정 사항메인 메뉴 텍스트 변경기존 메인 메뉴 텍스트를 ".. 2025. 5. 27.