안녕하세요~ 두결입니다.
지난시간에는 프로그레스바를 추가하고, 30초 카운트다운을 프로그레스바로 표시해보았습니다. 그리고, 새게임시 프로그레스바 초기화해주는 것까지 해보았습니다.
이번시간에는
5단계 16개 이미지를 구현해보겠습니다.
▣ 5단계 설정하기
switch(nGameStage)
{
case 1:
nCurImageCount = 4; // 1단계 이미지 개수 4개
break;
case 2:
nCurImageCount = 6; // 2단계 이미지 개수 6개
break;
case 3:
nCurImageCount = 8; // 3단계 이미지 개수 8개
break;
case 4:
nCurImageCount = 12; // 4단계 이미지 개수 12개
break;
case 5:
nCurImageCount = 16; // 4단계 이미지 개수 16개
break;
}
게임단계별 이미지 개수를 설정하는 부분인데요
5단계 16개로 설정해주었습니다.
5단계는 14개로 할까 했는데.. 4x4로 배치하는게 더 좋을것 같아서 그냥 16개로 해보겠습니다.
switch(nGameStage)
{
case 1:
fImagePosX[0] = 0.1f; fImagePosY[0] = 0.3f;
fImagePosX[1] = 0.9f; fImagePosY[1] = 0.3f;
fImagePosX[2] = 0.1f; fImagePosY[2] = 0.67f;
fImagePosX[3] = 0.9f; fImagePosY[3] = 0.67f;
break;
case 2:
fImagePosX[0] = 0.1f; fImagePosY[0] = 0.2f;
fImagePosX[1] = 0.9f; fImagePosY[1] = 0.2f;
fImagePosX[2] = 0.1f; fImagePosY[2] = 0.5f;
fImagePosX[3] = 0.9f; fImagePosY[3] = 0.5f;
fImagePosX[4] = 0.1f; fImagePosY[4] = 0.8f;
fImagePosX[5] = 0.9f; fImagePosY[5] = 0.8f;
break;
case 3:
fImagePosX[0] = 0.2f; fImagePosY[0] = 0.2f;
fImagePosX[1] = 0.8f; fImagePosY[1] = 0.2f;
fImagePosX[2] = 0.2f; fImagePosY[2] = 0.44f;
fImagePosX[3] = 0.8f; fImagePosY[3] = 0.44f;
fImagePosX[4] = 0.2f; fImagePosY[4] = 0.68f;
fImagePosX[5] = 0.8f; fImagePosY[5] = 0.68f;
fImagePosX[6] = 0.2f; fImagePosY[6] = 0.92f;
fImagePosX[7] = 0.8f; fImagePosY[7] = 0.92f;
break;
case 4:
fImagePosX[0] = 0.1f; fImagePosY[0] = 0.2f;
fImagePosX[1] = 0.5f; fImagePosY[1] = 0.2f;
fImagePosX[2] = 0.9f; fImagePosY[2] = 0.2f;
fImagePosX[3] = 0.1f; fImagePosY[3] = 0.39f;
fImagePosX[4] = 0.5f; fImagePosY[4] = 0.39f;
fImagePosX[5] = 0.9f; fImagePosY[5] = 0.39f;
fImagePosX[6] = 0.1f; fImagePosY[6] = 0.58f;
fImagePosX[7] = 0.5f; fImagePosY[7] = 0.58f;
fImagePosX[8] = 0.9f; fImagePosY[8] = 0.58f;
fImagePosX[9] = 0.1f; fImagePosY[9] = 0.77f;
fImagePosX[10] = 0.5f; fImagePosY[10] = 0.77f;
fImagePosX[11] = 0.9f; fImagePosY[11] = 0.77f;
break;
case 5:
fImagePosX[0] = 0.1f; fImagePosY[0] = 0.2f;
fImagePosX[1] = 0.37f; fImagePosY[1] = 0.2f;
fImagePosX[2] = 0.64f; fImagePosY[2] = 0.2f;
fImagePosX[3] = 0.91f; fImagePosY[3] = 0.2f;
fImagePosX[4] = 0.1f; fImagePosY[4] = 0.39f;
fImagePosX[5] = 0.37f; fImagePosY[5] = 0.39f;
fImagePosX[6] = 0.64f; fImagePosY[6] = 0.39f;
fImagePosX[7] = 0.91f; fImagePosY[7] = 0.39f;
fImagePosX[8] = 0.1f; fImagePosY[8] = 0.58f;
fImagePosX[9] = 0.37f; fImagePosY[9] = 0.58f;
fImagePosX[10] = 0.64f; fImagePosY[10] = 0.58f;
fImagePosX[11] = 0.91f; fImagePosY[11] = 0.58f;
fImagePosX[12] = 0.1f; fImagePosY[12] = 0.77f;
fImagePosX[13] = 0.37f; fImagePosY[13] = 0.77f;
fImagePosX[14] = 0.64f; fImagePosY[14] = 0.77f;
fImagePosX[15] = 0.91f; fImagePosY[15] = 0.77f;
break;
}
5단계 이미지의 위치도 설정해주었습니다.
switch(nGameStage) {
case 1:
layoutParams.width = 415;
layoutParams.height = 510;
break;
case 2:
layoutParams.width = 415;
layoutParams.height = 510;
break;
case 3:
layoutParams.width = 345;
layoutParams.height = 430;
break;
case 4:
layoutParams.width = 282;
layoutParams.height = 350;
break;
case 5:
layoutParams.width = 220;
layoutParams.height = 275;
break;
}
마지막으로
5단계일때의 이미지 크기도 설정해주었습니다.
자, 잘 되는지 실행해보겠습니다.
네 5단계 16개 이미지도 잘 되네요..^^
5단계 부터는 맞추기 조금 어렵네요..ㅎㅎ
▣ 게임 단계 표시를 위한 이미지 디자인하기
6단계로 가기전에 현재 내가 몇단계를 진행중인지를 표시해주면 좋을 것 같아서
게임 현재단계를 표시해보도록 하겠습니다.
그런데, 그냥 단순히 글자만 표시하면 밋밋하니까
약간 디자인을 해보겠습니다.
현재 게임단계를 나타낼수 있는 아이콘이 뭐가 있을까 생각해보다가 딱히 떠오르지 않아서
그냥 글씨로 만들었습니다. ㅎㅎ
Level의 약자로 LV라고 표시하고 그 오른쪽에 검은색 배경에 반투명 사각형으로 디자인 해보았습니다.
자, 이제 이것을 이미지로 저장해보겠습니다.
menu_level.png로 저장하였구요~
복사해서 프로젝트에 붙여넣기 하겠습니다.
메인 레이아웃화면에서
ImageView를 한개 갖다놓고 좀전에 만든 이미지를 설정해주었구요
TextView도 한개 추가하였습니다.
<ImageView
android:id="@+id/imgvMenuLevel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="@drawable/menu_level"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.01"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.01" />
<TextView
android:id="@+id/txtvMainCurGameStage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="0.3"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.06" />
ImageView의 아이디는 imgvMenuLevel이라고 하였고
TextView의 아이디는 txtvMainCurGameStage라고 하였습니다.
ImageView imgv_MenuLevel;
TextView txtv_MainCurGameStage;txtv_MainCurGameStage = findViewById(R.id.txtvMainCurGameStage);
txtv_MainCurGameStage.setTextSize(20);
txtv_MainCurGameStage.setTypeface(null, Typeface.BOLD);
txtv_MainCurGameStage.setGravity(Gravity.CENTER|Gravity.TOP);
txtv_MainCurGameStage.setTextColor(Color.parseColor("#FFFFFF"));
imgv_MenuLevel = findViewById(R.id.imgvMenuLevel);
그리고, ImageView와 TextView의 객체를 설정하고 기본설정까지 해주었습니다.
자, 여기까지 한번 실행해보겠습니다.
네 좌측 상단에 레벨표시용 이미지가 잘보이네요..^^
▣ 게임 현재 단계 표시하기
마지막으로 이제 레벨표시용 이미지위에 현재 게임단계를 표시해보도록 하겠습니다.
이미 TextView를 만들어놨기때문에
TextView에 게임단계만 설정하면 끝입니다.
// 새게임 시작
private void NewGame()
{
txtv_CountDown.setText("30.000");
pgbar_GameTime.setProgress(30); // 프로그레스바 초기화
txtv_MainCurGameStage.setText(nGameStage); // 현재 게임단계 표시
InitImageArray(); // 초기화
CreateImageView(); // 동적 ImageView 생성
ShowPopupCountDown();
}
위와같이 NewGame()함수에서
txtv_MainCurGameStage.setText()로 현재 게임단계를 표시해보았습니다.
잘되는지 볼까요?
네 게임단계도 잘 표시되네요.. ^^
이번시간은 여기까지만 하도록 하구요~
다음시간에는 6단계 가기전에
전체 게임시간을 한번 표시해보도록 하겠습니다.
그럼, 다음 이시간에~
감사합니다. ^^
