본문 바로가기

IT

[렌파이] 호감도 창 구현

이번 포스트에서는 게임 화면의 우측 상단에 호감도 창을 구현하는 방법을 설명한다.

 

호감도 창은 3명의 캐릭터에 대한 이름과 호감도 수치 그리고 호감도 바로 구성되어 있다.

게임 화면 내 우측 상단에 구현된 호감도 창

 

호감도 창 구성

init:
    screen stat_overlay:
        # 호감도 창
        frame:
            # 호감도 창 테두리와 컨텐츠와의 간격
            padding (15, 15)
            # 호감도 배경 (반투명 - 뒤 2자리 코드가 투명도)
            background "#4f5a6680"
            # x, y축 정렬
            align (1.0, 0.0)
            # 호감도 창 크기
            xmaximum 250
            ymaximum 200

            # 텍스트와 호감도 바가 수직으로 배치됨
            vbox:
                
                text "AA{space=15}[persistent.love[0]]" size 16
                bar:
                    value persistent.love[0]
                    # 호감도 바 범위
                    range 100
                    
                    # 아래 지정한 fixed_bar 스타일을 따름
                    style "fixed_bar"
                    
                # 다음 캐릭터의 바와 이전 캐릭터 텍스트 사이의 간격
                # padding을 쓸 경우, 바, 텍스트 간격 모두 동일하게 적용됨
                text " " size 3

                text "BB{space=15}[persistent.love[1]]" size 16

                bar:
                    value persistent.love[1]
                    range 100
                    xalign 0.0
                    style "fixed_bar"

                text " " size 3

                text "CC{space=15}[persistent.love[2]]" size 16

                bar:
                    value persistent.love[2]
                    range 100
                    xalign 0.5
                    style "fixed_bar"


init -5 python:
    # 호감도 바 스타일
    style.fixed_bar = Style(style.default)
    
    # bar width
    style.fixed_bar.xmaximum = 200
    
    # bar height
    style.fixed_bar.ymaximum = 15
    
    # bar의 gutter 부분 간격; 5로 지정할 시 5만큼 색이 칠해져있음
    style.fixed_bar.left_gutter = 0 
    style.fixed_bar.right_gutter = 0
    
    style.fixed_bar.left_bar = Frame("images/bar_full.png", 0, 0)
    style.fixed_bar.right_bar = Frame("images/bar_empty.png", 0, 0)

# 호감도 수치
define persistent.love = [80, 20, 10]


label start:
    # 배경
    scene bg building evening

    # 호감도 창 보여주기
    show screen stat_overlay
    
    "SHOW"
    
    # CC의 호감도 30 증가
    $ persistent.love[2] += 30
    
    # 호감도 창 숨기기
    hide screen stat_overlay
    
    "HIDE"
    
    return

(스크린 언어에서 텍스트에 데이터를 표기할 때는 [ ] 대괄호를 사용한다)

 

첨부 이미지 파일 3개를 아래 경로에 저장한다.

  게임 프로젝트 디렉토리 > game > images

1) bar_empty.png

bar_empty.png 파일 - 호감도가 비었을 때 나타남

2) bar_full.png

bar_full.png 파일 - 호감도가 찰 때 나타남

3) bg evening building.jpg

(배경 이미지 - 생략 가능)

 

bar_empty.png
0.00MB
bar_full.png
0.00MB
bg building evening.jpg
0.17MB

 


참고 사이트

askance.tistory.com/108

askance.tistory.com/204

askance.tistory.com/205

 

참고 렌파이 문서

www.renpy.org/doc/html/screen_actions.html?highlight=bar#bar-values

www.renpy.org/doc/html/screens.html?highlight=bar#bar

www.renpy.org/doc/html/style_properties.html?highlight=bar#bar-style-properties

 

참고 영상

www.youtube.com/watch?v=m30M4nE_Nl0