퀴즈 앱 만들기 - 5

사진과 같은 곳에서 퀴즈를 보여주고 값을 넘기고 받을 QuizQuestionActivity를 생성합니다.
override fun onCreate위에 변수를 선언해줍니다.

private var mCurrentPosition : Int = 1 //첫질문
    private var mQuestionList : ArrayList<Question>? = null //질문목록을 설정하기 위해 사용할 수 있는 개체가 필요
    private var mSelectedOptionPosition : Int = 0 //현재선택한값체크
    private var mCorrectAnswers : Int = 0 //정답개수
    private var mUserName: String? = null //사용자

주석처럼 처리할 변수를 선언하고 onCreate에서 퀴즈를 세팅하기 위해
setQuestion함수를 생성합니다.

이 함수는 mQuestionList에 질문들을 앱에서 표현할 수 있도록 해줍니다.

private fun setQuestion() {
        val question = mQuestionList!![mCurrentPosition - 1]
        //현재위치-1을 뺀 질문목록이 할당한질문nullable유형이될것이므로 리스트의 인덱스 처음은 0이니까 -1한듯 문제의id=1이지만 인덱스는 0
        defaultOptionsView() //질문을 새로 설정할때마다 기본 옵션보기를 설정
        if (mCurrentPosition == mQuestionList!!.size) {
            //문제를 출력할 때 지금이 size의 끝이라면 FINISH로 할당
            btn_submit.text = "FINISH"
        } else { //다음 문제가 더 있다면 submit
            btn_submit.text = "SUBMIT"
        }
        progressBar.progress = mCurrentPosition //진행률은 현재위치와 같다
        tv_progress.text = "$mCurrentPosition" + "/" + progressBar.max

        tv_question.text = question!!.question //보여지고 있는 문제의 text는 question데이터 클래스에 저장된 question을 저장(호출)
        iv_image.setImageResource(question.image)
        tv_option_one.text = question.optionOne
        tv_option_two.text = question.optionTwo
        tv_option_three.text = question.optionThree
        tv_option_four.text = question.optionFour
    }

.xml의 id를 통해 Constants에서 설정해둔 이미지, 옵션, 등을 할당해줍니다.
또한 if-else구문은 submit버튼의 텍스트를 변경하는 코드입니다.
여기서 defaultOptionsView는 처음 문제를 접했을 때 설정된 기본 선택지 상태를 의미합니다.

private fun defaultOptionsView() {
        val options = ArrayList<TextView>()//ui보기요소
        options.add(0, tv_option_one)
        options.add(1,tv_option_two)
        options.add(2,tv_option_three)
        options.add(3,tv_option_four)

        //사용자 인터페이스에 만든 드로어블 버튼테두리 색칠에 대해 기본 ui를 할당하는 for루프 만듦
        for (option in options) {
            option.setTextColor(Color.parseColor("#7A8089"))
            option.typeface = Typeface.DEFAULT
            //drawable을 사용하기 위해 contextcompat사용함
            option.background = ContextCompat.getDrawable(
                this,
                R.drawable.default_option_border_bg
                )
        }
    }

drawable에서 default_option_border_bg.xml을 생성하여 위에 코드에 사용하였습니다.

<?xml version="1.0" encoding="utf-8"?>
<!--텍스트모양네모디자인 shape-->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <stroke
        android:width="1dp"
        android:color="#AAA4AE"/>
    <solid android:color="@android:color/white"/>

    <corners android:radius="5dp"/>
</shape>

이를 통해 옵션의 상태를 설정하였습니다.

다음시간에 뵙도록 하겠습니다.