[Android] 퀴즈 앱 실습: 앱이 종료되는 버그 처리, 프로그레스 바, portrait, landscape

퀴즈 앱을 만들어 보자.

 

res의 strings.xml에 퀴즈 문제들을 넣는다.

 

<resources>
    <string name="app_name">QuizApp</string>

    <string name="q1">A honey bee can fly at 15mph.</string>
    <string name="q2">A jellyfish is approximately 95% water.!</string>
    <string name="q3">Elephants are the only mammals that can\'t jump</string>
    <string name="q4">Cats can hear ultrasound.</string>
    <string name="q5">A human brain weighs about three pounds.</string>
    <string name="q6">The tongue is the fastest healing part of the body.</string>
    <string name="q7">Americans, on average, eat 18 acres of \"pizza\" a day.</string>
    <string name="q8">A kangaroo can jump 30 feet.</string>
    <string name="q9">A pigeon\'s feathers are heavier than its bones.</string>
    <string name="q10">The tallest man was 8 ft. 11 in.</string>
</resources>

 

 

그 후 activity_main.xml에서 레이아웃, TextView, 그리고 버튼을 이용해서 틀을 잡아준다.

 

 

 

java폴더의 MainActivity 과 같은위치 안에 패키지를 만들자

 

 

 

그리고 이 안에 Quiz라는 이름의 클래스를 생성한다.

 

package com.eyoo.quizapp.model;

public class Quiz {
    public int question;
    public boolean answer;


    public Quiz(int question, boolean answer) {
        this.question = question;
        this.answer = answer;
    }
}

 

 

이제 문제를 화면에 보여주고 버튼을 클릭하면 결과가 나오는 앱을 만든다.

# 첫번째 문제부터 열번째 문제까지 순서대로 문제가 나오도록 하며,

# 열번째 문제까지 다 풀었으면 지금까지 맞춘 문제를 얼마나 맞췄는지 textResult에 표시하자.

 

    TextView txtQuiz;
    TextView txtResult;
    Button btnTrue;
    Button btnFalse;
    ArrayList<Quiz> quizArrayList =new ArrayList<Quiz>();


    int quizIndex = 0;
    int count = 0;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // 화면연결
        txtQuiz = findViewById(R.id.txtQuiz);
        txtResult = findViewById(R.id.txtResult);
        btnTrue = findViewById(R.id.btnTrue);
        btnFalse = findViewById(R.id.btnFalse);

        // 퀴즈 만들어준다.
        setQuizData();

        // 첫번째 퀴즈 문제를 화면에 낸다.
        txtQuiz.setText(quizArrayList.get(quizIndex).question);

        // 버튼을 누르면 정답인지 아닌지 알려주는 코드
        btnTrue.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // 현재 문제의 정답을 가져온다.
                boolean answer = false;

                if (quizIndex < quizArrayList.size()){
                    answer = quizArrayList.get(quizIndex).answer;
                } else {
                    return;
                }

                // 트루버튼이므로 정답이 트루면 결과 텍스트뷰에 정답입니다 출력 아니면 틀렸습니다 출력
                if (answer == true) {
                    txtResult.setText("정답입니다");
                    count = count + 1;
                } else {
                    txtResult.setText("틀렸습니다");
                }

                // 그 다음 문제를 출제한다.
                quizIndex = quizIndex + 1;
                if (quizIndex < quizArrayList.size()) {
                    txtQuiz.setText(quizArrayList.get(quizIndex).question);
                } else {
                    txtQuiz.setText("모든 문제를 풀었습니다.");
                    txtResult.setText(count + "개의 문제를 맞췄습니다.");
                }


            }
        });

        btnFalse.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                // 현재 문제의 정답을 가져온다.
                boolean answer = false;

                if (quizIndex < quizArrayList.size()){
                    answer = quizArrayList.get(quizIndex).answer;
                } else {
                    return;
                }


                // 트루버튼이므로 정답이 트루면 결과 텍스트뷰에 정답입니다 출력 아니면 틀렸습니다 출력
                if (answer == false) {
                    txtResult.setText("정답입니다");
                    count = count + 1;
                } else {
                    txtResult.setText("틀렸습니다");
                }

                // 그 다음 문제를 출제한다.
                quizIndex = quizIndex + 1;
                if (quizIndex < quizArrayList.size()) {
                    txtQuiz.setText(quizArrayList.get(quizIndex).question);
                } else {
                    txtQuiz.setText("모든 문제를 풀었습니다.");
                    txtResult.setText(count + "개의 문제를 맞췄습니다.");
                }


            }
        });



    }

    void setQuizData(){
        Quiz q1 = new Quiz(R.string.q1, true);  // 퀴즈 클래스 객체생성, res의 string에서 q1 입력
        quizArrayList.add(q1);
        Quiz q2 = new Quiz(R.string.q2, false);
        quizArrayList.add(q2);
        Quiz q3 = new Quiz(R.string.q3, true);
        quizArrayList.add(q3);
        Quiz q4 = new Quiz(R.string.q4, false);
        quizArrayList.add(q4);
        Quiz q5 = new Quiz(R.string.q5, true);
        quizArrayList.add(q5);
        Quiz q6 = new Quiz(R.string.q6, false);
        quizArrayList.add(q6);
        Quiz q7 = new Quiz(R.string.q7, true);
        quizArrayList.add(q7);
        Quiz q8 = new Quiz(R.string.q8, false);
        quizArrayList.add(q8);
        Quiz q9 = new Quiz(R.string.q9, true);
        quizArrayList.add(q9);
        Quiz q10 = new Quiz(R.string.q10, false);
        quizArrayList.add(q10);
    }

# Quiz로 리스트를 만들었다.

# setQuizData 함수를 만들어 문제들을 불러온다.

# quizIndex를 멤버변수로 만들어 버튼을 누를 때 마다 quizIndex가 더해져 다음 문제가 나오도록 한다.

# quizIndex가 10 이상이 되면 처리되지 않도록 한다.

# count를 만들어 문제를 얼마나 맞췄는지 볼수있도록 만들었다.

 

 

 

 

프로그레스 바를 추가해보자.

 

        <ProgressBar
            android:id="@+id/progressBar"
            style="?android:attr/progressBarStyleHorizontal"
            android:layout_width="match_parent"
            android:layout_height="10dp"
            android:max="10"
            android:progress="0" />

 

 

메인에서 작업을 한다.

 

                // 그 다음 문제를 출제한다.
                quizIndex = quizIndex + 1;
                progressBar.incrementProgressBy(1);
                if (quizIndex < quizArrayList.size()) {
                    txtQuiz.setText(quizArrayList.get(quizIndex).question);
                } else {
                    txtQuiz.setText("모든 문제를 풀었습니다.");
                    txtResult.setText(count + "개의 문제를 맞췄습니다.");
                }

# incrementProgressBy 활용하거나 setProgress에 quizIndex+1을 사용한다.

 

 

프로그레스 바가 잘 보이는것을 확인할수있다.

 

 

 

추가적으로 스마트폰의 화면 회전 방향도 설정할수 있다.

 

AndroidManifest에서 activity 밑에 screenOrientation을 작성한다.

 

            android:name=".MainActivity"
            android:screenOrientation=""
            android:exported="true">

# 이때 portrait는 세로로만 사용할수 있으며 landscape는 가로로만 사용할수있다.