짧은 만화

more

고도 엔진

more

고도 엔진 슈팅게임 #4: UI

[게임 UI]시작버튼, 게임 상태, 점수, 목숨을 설정 할 수 있도록 만들 것이다.다음 단계를 따라 UI 설정을 하자. [새 씬] 으로 새로운 씬을 만들고 CanvasLayer 루트 노드를 생성한뒤 이름을 HUD로 변경한다.HUD 하위에 Timer와 MarginContainer 를 추가한다. 1Timer 노드는 One Shot 속성에 체크해주고 Wait Time을 2로 설정한다. 3MarginContainer 에는 점수와 남은 목숨 두가지가 들어갈것이다. 앵커 프리셋 설정을 '위쪽 넓게'로 해준다.그리고 [인스펙터] 탭의 Theme Overrides - Constants 옵션에서 margin을 네 부분 모두 20으로 설정한다. 2MarginContainer 하위 노드로 HBoxContainer를 추가한다..
토이프로젝트 2024.10.29 2

고도 엔진 슈팅게임 #3: 바위 씬

[바위 씬 생성]RigidBody2D로 새 씬을 생성한 후 Rock 으로 이름을 변경한다.Rock의 자식으로 Sprite2D를 추가하고 Texture 에 바위 이미지를 추가한다.Rock의 자식으로 CollisionShape2D를 추가한다. 히트박스는 생성될 바위의 모양에 맞게 동적으로 생성해 줄 것이므로 아직 설정하지 않는다. 바위는 플레이어처럼 움직이다가 멈추면 안되고 계속 날아다녀야 하니 Linear와 Angular의 Damp는 0으로, Damp Mode 는 Replace로 변경한다.또 바위를 서로 튕기게 만들어야 하므로 Physics Material Override 에서 '새 Physics Material'을 눌러주고 상세 옵션에서 Bounce를 1로 설정한다. Rock 에 스크립트를 붙여서 다음 ..
토이프로젝트 2024.10.01 4

고도 엔진 슈팅게임 #2: 화면이동, 슈팅

[화면 이동]screen wrap 기능을 넣을 것이다.플레이어가 화면의 끝에 다다르면 반대편으로 나오는 것을 말한다. 스크립트 상단에 다음 코드를 추가하고 var screensize = Vector2.ZERO _ready() 에 다음 코드를 추가한다.screensize = get_viewport_rect().size # 화면 크기  그리고 플레이어가 한쪽 끝에 다다르면 반대편으로 이동시켜야 하는데, 여기서 문제가 있다.다음과 같은 코드로 플레이어를 이동시키면 된다고 생각할 수 있지만func _physics_process(delta): ... if position.x > screensize.x: position.x = 0 if position.x screensize.y: position.y = 0 ..
토이프로젝트 2024.09.24 3

[HTML] HTML canvas로 Flow Field 구현하기

Flow Field Flow Field 는 시뮬레이션에 사용되는 그래픽 기술로, 각 지점에 대한 특정 방향으로의 흐름을 나타내는 표현 방법이다. (feat. chat GPT) 예시를 찾아보면 초등학생 때 철가루와 자석을 이용해 자기장을 표시하는 듯한 비주얼이다. generative art 결과물들을 보면 여기에서도 많이 쓰이는듯한데 p5.js 라는 라이브러리를 이용하면 좀 더 편하게 구현할 수 있는 모양이다. 하지만 간단한 건 직접 구현하기 그다지 어렵지 않으니 HTML canvas + JavaScript 로 직접 구현해 보자. 결과물 위처럼 마우스 드래그 할 때마다 Flow Field가 그려지도록 만들 것이다. Flow Field 구현 세세한 코드를 전부 올리진 않고(어차피 GitHub에 있으니..) ..
WEB 2024.02.20 0

인기 글

[CSS] 말줄임(...)표: 한줄 또는 여러줄 말줄임 표시

아래처럼 말줄임표를 표시하는 방법을 알아보자. 1. 한 줄일 때 말줄임표 말줄임표를 적용해야 하는 텍스트가 한 줄인 경우는 아래처럼 css를 작성한다. div { width: 200px; /* 오버되면 말줄임 적용할 최대 넓이 */ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 결과 2. 여러 줄일 때 말줄임표 말줄임표를 적용해야 하는 텍스트가 한 줄인 이상인 경우는 아래처럼 css를 작성한다. div { width: 200px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 2줄 넘어가면 말줄임 */ -webkit-b..
WEB 2023.03.30 0
2년차 비전공자 프런트엔드 개발자의 6개월간의 이직 기록

요약 회사를 다니면서 3개월 + 퇴사 후 3개월 = 총 6개월간 이직 준비를 하였고 지금은 이직에 성공하여 번개장터에서 개발자로 일하고 있다! 2년 차 개발자였지만 비전공자에 거의 0년 차 개발자 수준이었던 내가 이직을 하게 된 과정을 정리하려고 한다. 이직 결심 2년간 중소기업 쇼핑몰에서 풀 스택 개발자(말이 풀 스택이지 프런트엔드, 백엔드 구분조차 없는 곳+개발자 없음으로 그냥 모든 일을 다 했다..)로 일했다. 이직을 결심했던 건 사실 꽤 오래되었는데 내일 채움 공제 적금을 넣고 있어서 1년만 더 참자.. 10개월만 더 참자.. 6개월만... 3개월만... 해가면서 2년을 버텨냈다. 이직을 결심한 이유는 크게 두 가지로 압축할 수 있다. 1. 개발 문화 없음, 개발자가 성장할 수 없는 환경 2. 낮..
기타 2022.07.01 0
[MSSQL] where절에 if문 같은 조건 사용하기

프로시저에서 데이터 조회 쿼리를 짤 때 where절에서 파라미터 값에 따라 다른 조건을 넣어줘야 하는 경우가 생겼다. sql실행문을 string변수에 담아 실행하는 방법도 있지만 이미 짜 놓은 쿼리가 있어서 전부 string형으로 변경하려면 시간이 꽤 소요될 것 같았다. create table #temp_table ( fruit varchar(10), quantity int ) insert into #temp_table values('apple',2) insert into #temp_table values('pear',0) insert into #temp_table values('banana',3) insert into #temp_table values('strawberry',0) insert into ..
MSSQL 2021.05.21 0

티스토리툴바