반응형

[HTML 레이아웃]




[HTML 코드]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<body>
    <form name=form method="post" onsubmit="return checkAll()">
      <table width=750 border="1px" align=center>
        <tr>
          <th colspan="2" bgcolor="#E4F7BA" >회원 기본 정보</th>
        </tr>
        <tr>
          <td>아이디</td>
          <td><input type="text" name="userId"> 4~12자의 영문 대소문자와 숫자로만 입력</td>
        </tr>
        <tr>
          <td>비밀번호</td>
          <td><input type="password" name="password1"> 4~12자의 영문 대소문자와 숫자로만 입력</td>
        </tr>
        <tr>
          <td>비밀번호 확인</td>
          <td><input type="password" name="password2"></td>
        </tr>
        <tr>
          <td>메일주소</td>
          <td><input type="text" name="mail"> 예)id@domain.com</td>
        </tr>
        <tr>
          <td>이름</td>
          <td><input type="text" name="name"></td>
        </tr>
        <tr>
          <td>주민등록번호</td>
          <td>
              <input type="text" name="identi1" style="width:70px">
              -
              <input type="password" name="identi2" style="width:70px">
              </td>
        </tr>
        <tr>
          <td>관심분야</td>
          <td>
            <input type="checkbox" name="favorite" value="컴퓨터">컴퓨터
            <input type="checkbox" name="favorite" value="인터넷">인터넷
            <input type="checkbox" name="favorite" value="여행">여행
            <input type="checkbox" name="favorite" value="영화감상">영화감상
            <input type="checkbox" name="favorite" value="음악감상">음악감상
          </td>
        </tr>
        <tr>
          <td>자기소개</td>
          <td><textarea name="introduceMyself" id=intro name=intro cols=50 rows=10></textarea>
            </td>
        </tr>
      </table>
      <p align=center>
        <input type="submit" name="join" value="회원 가입">
        <input type="reset" name="reset" value="다시 입력">
      </p>
    </form>
    </body>
cs


코드설명
1
<form name=form method="post" onsubmit="return checkAll()">
cs
submit 버튼을 누르면 script의 checkAll()가 호출된다.




[JavaScript 코드]



코드설명

checkAll()함수에서는 각각의 input값을 확인하는 함수를 호출하는 함수이다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function checkAll() {
        if (!checkUserId(form.userId.value)) {
            return false;
        } else if (!checkPassword(form.userId.value, form.password1.value,
                form.password2.value)) {
            return false;
        } else if (!checkMail(form.mail.value)) {
            return false;
        } else if (!checkName(form.name.value)) {
            return false;
        } else if (!checkBirth(form.identi1.value, form.identi2.value)) {
            return false;
        } else if (!checkFavorite()) {
            return false;
        } else if (!checkIntro()) {
            return false;
        }
        return true;
    }
}
s

조건문을 보면 checkUserId함수에서 폼에 입력된 값이 유효성 검사에 맞으면 true를 return해준다.

따라서 if조건문 내로 들어가지 않으므로 다음 조건문을 실행하게 된다.

아래의 else if문도 마찬가지로 똑같이 수행한다.

함수의 매개변수로는 form내에 있는 해당되는 input태그의 id의 값을 가져온다.




1
2
3
4
5
6
7
8
// 공백확인 함수
    function checkExistData(value, dataName) {
        if (value == "") {
            alert(dataName + " 입력해주세요!");
            return false;
        }
        return true;
    }
cs

checkAll함수를 제외한 모든 함수에 첫번째로 들어가 있는 코드가 공백 확인 함수이다.

유효성 검사하면서 값이 공백이라면 "영문 대소문자와 숫자 4~12자리로 입력해야합니다!"라고 출력해도 되지만 공백임을 알려주기 위해 따로 함수로 빼내었다.

매개변수로 들어오는 value는 input태그의 값이고 dataName은 해당되는 input태그의 종류가 무엇인지 알려주는 String 변수이다.

값이 공백일 경우 alert를 통해 사용자에게 공백임을 알리고 false를 return하면서 이 함수를 호출한 함수를 끝내버린다.


이제부터 각각의 유효성 검사 함수를 알아보자.



먼저 볼 함수는 id를 검사하는 함수이다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
    function checkUserId(id) {
        //Id가 입력되었는지 확인하기
        if (!checkExistData(id, "아이디를"))
            return false;
 
        var idRegExp = /^[a-zA-z0-9]{4,12}$/; //아이디 유효성 검사
        if (!idRegExp.test(id)) {
            alert("아이디는 영문 대소문자와 숫자 4~12자리로 입력해야합니다!");
            form.userId.value = "";
            form.userId.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
cs

함수 매개변수로 넘어오는 값은 input태그에 들어가는 값이다.


3라인은 방금전 언급했던 공백확인 함수이다.

만약 id의 값이 공백일 경우 checkExistData함수에서는 false를 return해주므로 !에 의해 if조건문은 true가 된다.

4라인에서 return false를 해주면서 checkAll함수 2번3번 라인에서 script가 끝난다.


이어서 6라인은 아이디 유효성을 검사하는 정규표현식(Regular Expression)이다.

위의 코드에서 사용한 정규표현식을 간단하게 언급하고 가면..

→ / : 자바스크립트의 정규표현식의 처음과 끝을 의미한다.

→ [ ] : 문자셋이다. 예를 들면 [a-z]라고 적을경우 정규표현식에 만족해야하는 값들은 반드시 a~z사이의 값만 넣을 수 있다.

→ ^ : 문장의 처음을 뜻한다.

→ $ : 문장의 마지막을 뜻한다.

→ { } : 문자열 길이를 뜻한다. 예를 들어 {4,12}일 경우 최소 길이 4, 최대 길이 12이다.


/^[a-zA-z0-9]{4,12}$/ 을 분석하면..

→ 영문 대/소문자, 숫자만 사용할 수 있고 길이는 최소 4, 최대 12를 만족해야 정규표현식에 만족한다.


정규표현식에 대해 더 알아보고싶으면

→ https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/%EC%A0%95%EA%B7%9C%EC%8B%9D

여기 들어가서 참고하면 된다.


if조건문에서 test는 정규표현식과 id의 값이 일치하는지 아닌지 확인하는 함수이다.

일치하면 true를 return 일치하지 않으면 false를 return한다.

만약 일치하지 않을 경우 사용자에게 해당 조건을 알려주는 알림창을 띄워준다.

그리고 폼에 입력된 값을 공백으로 초기화하고 포커스를 맞춰준다.


정규표현식과 id의 값이 같을 경우 return true를 하고 다음 함수를 실행한다.



다음은 비밀번호 검사 함수이다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
    function checkPassword(id, password1, password2) {
        //비밀번호가 입력되었는지 확인하기
        if (!checkExistData(password1, "비밀번호를"))
            return false;
        //비밀번호 확인이 입력되었는지 확인하기
        if (!checkExistData(password2, "비밀번호 확인을"))
            return false;
 
        var password1RegExp = /^[a-zA-z0-9]{4,12}$/; //비밀번호 유효성 검사
        if (!password1RegExp.test(password1)) {
            alert("비밀번호는 영문 대소문자와 숫자 4~12자리로 입력해야합니다!");
            form.password1.value = "";
            form.password1.focus();
            return false;
        }
        //비밀번호와 비밀번호 확인이 맞지 않다면..
        if (password1 != password2) {
            alert("두 비밀번호가 맞지 않습니다.");
            form.password1.value = "";
            form.password2.value = "";
            form.password2.focus();
            return false;
        }
 
        //아이디와 비밀번호가 같을 때..
        if (id == password1) {
            alert("아이디와 비밀번호는 같을 수 없습니다!");
            form.password1.value = "";
            form.password2.value = "";
            form.password2.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }    
cs

비밀번호가 만족해야할 조건은 

1. 영문 대/소문자와 숫자 4~12자리로 입력할 것

2. 비밀번호 두번 입력했을 때 두번 다 일치할 것

3. 아이디와 비밀번호는 불일치 할 것


3~7라인은 비밀번호 / 비밀번호 확인이 공백인지 확인하기 위한 조건문이다.

조건문이 어떻게 동작하는지 알고싶을 땐 위의 checkId함수 설명을 참고하길 바란다.


checkPassword함수는 매개변수로 id와 두 개로 입력된 password를 받는다.


9~15라인은 비밀번호 유효성을 검사하는 코드로 아이디 유효성 검사 정규표현식과 같다.

위의 checkId함수 설명을 참고하길 바란다.


만약 두번 입력된 값이 틀릴경우 17~23라인 조건문을 실행한다.

사용자에게 입력된 두 비밀번호가 일치하지 않음을 알려준다.

그리고 두 비밀번호 입력창을 공백으로 설정해준 다음 포커스를 첫번째 비밀번호 입력창에 준다.

마지막으로 return false


만약 아이디와 비밀번호가 같을 경우 26~32라인 조건문을 실행한다.

아래의 조건문 실행은 위의 비밀번호 일치 여부 확인하는 조건문과 같다.


비밀번호 모든 조건이 맞을 경우 true를 return..



다음은 이메일을 검사하는 함수이다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
    function checkMail(mail) {
        //mail이 입력되었는지 확인하기
        if (!checkExistData(mail, "이메일을"))
            return false;
 
        var emailRegExp = /^[A-Za-z0-9_]+[A-Za-z0-9]*[@]{1}[A-Za-z0-9]+[A-Za-z0-9]*[.]{1}[A-Za-z]{1,3}$/;
        if (!emailRegExp.test(mail)) {
            alert("이메일 형식이 올바르지 않습니다!");
            form.mail.value = "";
            form.mail.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
cs

6라인.. 이메일 정규표현식을 보면 

→ ^[A-Za-z0-9_]+[A-Za-z0-9] : 이메일의 경우 첫글자 _가 허용되므로 첫번째 글자 검사식을 따로 두었다.

그 뒤 영문 대/소문자 숫자만 사용 할 수 있게 조건을 걸었다.

→ *[@]{1} : @는 반드시 하나만 입력되어야 한다.

→ *[.]{1} : .은 반드시 하나만 입력되어야 한다.

→ [A-Za-z]{1,3} : 최소 한글자 최대 세글자 까지 입력 가능하다.


7~12라인은 정규표현식과 이메일의 값이 일치하지 않을 경우 조건문을 실행한다.


이메일 값이 정규표현식에 만족할 경우 return true.



다음은 이름 검사 함수이다.

1
2
3
4
5
6
7
8
9
10
11
    function checkName(name) {
        if (!checkExistData(name, "이름을"))
            return false;
 
        var nameRegExp = /^[가-힣]{2,4}$/;
        if (!nameRegExp.test(name)) {
            alert("이름이 올바르지 않습니다.");
            return false;
        }
        return true; //확인이 완료되었을 때
    }
cs


5라인은 한글만 입력할 수 있는 정규표현식이다.


이름 값이 정규표현식에 만족할 경우 return true.



다음은 주민등록번호를 검사하는 함수이다.


주민등록번호 유효성을 검사하는 식이 따로 있는데 

주민등록번호 13자리를...

 

1

2 

3 

4 

5 

6 

- 

1 

2 

3 

4 

5 

6 

7 

× 

2 

3 

4 

5 

6 

7 

 

8 

9 

2 

3 

4 

5 

 


주민등록번호 13번째 자리 값을 제외하고 위아래로 각각 값을 곱한 후 각 결과값을 모두 더한다.

더한 값을 sum이라 하면

<11 - (sum % 11) %10>

위의 식에서 도출되는 값과 주민등록번호 13번째 값과 일치하면 유효한 주민등록번호이다.


이를 토대로 주민등록번호 검사하는 함수를 보면..

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
    function checkBirth(identi1, identi2) {
        //birth이 입력되었는지 확인하기
        if (!checkExistData(identi1, "주민등록번호를 ")
                || !checkExistData(identi2, "주민등록번호를 "))
            return false;
 
        var totalIdenti = "" + identi1 + identi2;
 
        var identiArr = new Array();
        var sum = 0;
        var plus = 2;
 
        //배열에 주민등록번호 입력 후 유효값 확인하기 위해 sum에 저장
        for (var i = 0; i < 12; i++) {
            identiArr[i] = totalIdenti.charAt(i);
            if (i >= 0 && i <= 7) {
                sum += totalIdenti[i] * plus;
                plus++;
                if (i == 7)
                    plus = 2;
            } else {
                sum += totalIdenti[i] * plus;
                plus++;
            }
        }
        //주민등록번호 길이 확인하기
        if (identiArr.length < 12) {
            alert("주민등록번호는 13자리입니다.");
            form.identi1.value = "";
            form.identi2.value = "";
            form.identi1.focus();
            return false;
        }
        //주민등록번호 유효한지 확인
        var result = 11 - (sum % 11) % 10
        if (result != totalIdenti.charAt(12)) { //주민등록번호가 유효하지 않은 경우
            alert("유효하지않은 주민번호입니다.");
            form.identi1.value = "";
            form.identi2.value = "";
            form.identi1.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
cs

매개변수가 두개인 이유는 폼에서 주민번호 입력창을 두개로 두었다.

이 때문에 totalIdenti라는 변수에 문자열 결합을 해준다.


13~24라인은 유효성 검사를 위해 totalIdenti 값을 identiArr배열에 하나하나 입력을 해준다.

배열에 입력하면서 sum값을 바로 계산해 준다.


위의 주민등록번호 유효성 검사 표를 보면 1번째부터 8번째 자리까지 2부터 순차적으로 값이 올라가면서 곱해지다가

9번째 자리부터는 다시 2로 돌아간다.

6~24라인이 이를 조건식으로 변환한 라인이다.


27~33라인은 주민등록번호 길이가 13자리인지 확인하고


마지막으로 35~42라인이 주민등록번호가 유효한지 확인하는 조건식이다.


주민등록번호가 모든 조건에 만족하였을 경우 return true



다음은 관심분야에서 하나 이상 체크되었는지 확인하는 함수다.

1
2
3
4
5
6
7
8
9
10
11
12
    function checkFavorite() {
        var checkedFavorite = document.getElementsByName("favorite");
 
        //체크된 값이 하나라도 있을경우 바로 true
        for (var i = 0; i < checkedFavorite.length; i++) {
            if (checkedFavorite[i].checked == true) {
                return true;
            }
        }
        alert("관심분야를 체크해주세요!");
        return false;
    }
cs

document.getElementsByName("favorite")는 HTML에서 같은 name("favorite")으로 묶인 checkbox의 값을 배열로 가져온다.


5~9라인은 체크된 값이 하나라도 있을 경우 바로 true를 return시켜줌으로써 함수를 끝낸다.

for문에서 return되지 않는다면 체크된 값이 하나라도 되지 않는 경우이므로 알림창을 띄워주고 return false를 한다.



마지막으로 자기소개 항목에서 값이 들어있는지 확인하는 함수이다.

1
2
3
4
5
6
7
8
    function checkIntro() {
        var text = document.getElementById("intro");
        if (!checkExistData(text.value, "자기소개를")) {
            alert("자기소개를 입력해 주세요!");
            return false;
        } else
            return true;
    }
cs

document.getElementById("intro")는 HTML에서 id("intro")를 가져와 그에 해당되는 값을 입력해준다.

만약 값이 공백일 경우 알림창을 띄워주고 return false를 한다.




전체적인 JavaScript코드이다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
<script language="javascript">
    function checkAll() {
        if (!checkUserId(form.userId.value)) {
            return false;
        }
        if (!checkPassword(form.userId.value, form.password1.value,    form.password2.value)) {
            return false;
        }
        if (!checkMail(form.mail.value)) {
            return false;
        }
        if (!checkName(form.name.value)) {
            return false;
        }
        if (!checkBirth(form.identi1.value, form.identi2.value)) {
            return false;
        }
        if (!checkFavorite()) {
            return false;
        }
        if (!checkIntro()) {
            return false;
        }
 
        return true;
    }
 
    // 공백확인 함수
    function checkExistData(value, dataName) {
        if (value == "") {
            alert(dataName + " 입력해주세요!");
            return false;
        }
        return true;
    }
 
    function checkUserId(id) {
        //Id가 입력되었는지 확인하기
        if (!checkExistData(id, "아이디를"))
            return false;
 
        var idRegExp = /^[a-zA-z0-9]{4,12}$/; //아이디 유효성 검사
        if (!idRegExp.test(id)) {
            alert("아이디는 영문 대소문자와 숫자 4~12자리로 입력해야합니다!");
            form.userId.value = "";
            form.userId.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
 
    function checkPassword(id, password1, password2) {
        //비밀번호가 입력되었는지 확인하기
        if (!checkExistData(password1, "비밀번호를"))
            return false;
        //비밀번호 확인이 입력되었는지 확인하기
        if (!checkExistData(password2, "비밀번호 확인을"))
            return false;
 
        var password1RegExp = /^[a-zA-z0-9]{4,12}$/; //비밀번호 유효성 검사
        if (!password1RegExp.test(password1)) {
            alert("비밀번호는 영문 대소문자와 숫자 4~12자리로 입력해야합니다!");
            form.password1.value = "";
            form.password1.focus();
            return false;
        }
        //비밀번호와 비밀번호 확인이 맞지 않다면..
        if (password1 != password2) {
            alert("두 비밀번호가 맞지 않습니다.");
            form.password1.value = "";
            form.password2.value = "";
            form.password2.focus();
            return false;
        }
 
        //아이디와 비밀번호가 같을 때..
        if (id == password1) {
            alert("아이디와 비밀번호는 같을 수 없습니다!");
            form.password1.value = "";
            form.password2.value = "";
            form.password2.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
 
    function checkMail(mail) {
        //mail이 입력되었는지 확인하기
        if (!checkExistData(mail, "이메일을"))
            return false;
 
        var emailRegExp = /^[A-Za-z0-9_]+[A-Za-z0-9]*[@]{1}[A-Za-z0-9]+[A-Za-z0-9]*[.]{1}[A-Za-z]{1,3}$/;
        if (!emailRegExp.test(mail)) {
            alert("이메일 형식이 올바르지 않습니다!");
            form.mail.value = "";
            form.mail.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
 
    function checkName(name) {
        if (!checkExistData(name, "이름을"))
            return false;
 
        var nameRegExp = /^[가-힣]{2,4}$/;
        if (!nameRegExp.test(name)) {
            alert("이름이 올바르지 않습니다.");
            return false;
        }
        return true; //확인이 완료되었을 때
    }
 
    function checkBirth(identi1, identi2) {
        //birth이 입력되었는지 확인하기
        if (!checkExistData(identi1, "주민등록번호를 ")
                || !checkExistData(identi2, "주민등록번호를 "))
            return false;
 
        var totalIdenti = "" + identi1 + identi2;
 
        var identiArr = new Array();
        var sum = 0;
        var plus = 2;
 
        //배열에 주민등록번호 입력 후 유효값 확인하기 위해 sum에 저장
        for (var i = 0; i < 12; i++) {
            identiArr[i] = totalIdenti.charAt(i);
            if (i >= 0 && i <= 7) {
                sum += totalIdenti[i] * plus;
                plus++;
                if (i == 7)
                    plus = 2;
            } else {
                sum += totalIdenti[i] * plus;
                plus++;
            }
        }
        //주민등록번호 길이 확인하기
        if (identiArr.length < 12) {
            alert("주민등록번호는 13자리입니다.");
            form.identi1.value = "";
            form.identi2.value = "";
            form.identi1.focus();
            return false;
        }
        //주민등록번호 유효한지 확인
        var result = 11 - (sum % 11) % 10
        if (result != totalIdenti.charAt(12)) { //주민등록번호가 유효하지 않은 경우
            alert("유효하지않은 주민번호입니다.");
            form.identi1.value = "";
            form.identi2.value = "";
            form.identi1.focus();
            return false;
        }
        return true; //확인이 완료되었을 때
    }
    function checkFavorite() {
        var checkedFavorite = document.getElementsByName("favorite");
 
        //체크된 값이 하나라도 있을경우 바로 true
        for (var i = 0; i < checkedFavorite.length; i++) {
            if (checkedFavorite[i].checked == true) {
                return true;
            }
        }
        alert("관심분야를 체크해주세요!");
        return false;
    }
 
    //자기소개가 입력되었는지 확인하기
    function checkIntro() {
        var text = document.getElementById("intro");
        if (!checkExistData(text.value, "자기소개를")) {
            alert("자기소개를 입력해 주세요!");
            return false;
        } else
            return true;
    }
</script>
cs


★ 잘못된 정보나 피드백은 언제든 환영입니다. ★


반응형

'Web > HTML_JS_CSS' 카테고리의 다른 글

[Javascript] Script 파일의 위치와 onload..  (2) 2019.01.08
[Javascript] Javascript 사용 방법  (2) 2019.01.08
[css] 선택자  (2) 2019.01.07
[HTML] 회원가입 폼 만들기  (0) 2018.08.17
[HTML/JavaScript] 계산기 만들기  (0) 2018.07.30
반응형

레이아웃 디자인은 수업시간에 강사님께서 제시해준 레이아웃이다.




<loginFom.html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<html>
    <head>
        <title> 로그인 폼 </title>
    </head>
    <body>
    <form name=form method="post" action="mailto:olsh1108o@daum.net">
      <table width=650 border="1px" align=center>
        <tr>
          <th colspan="2" bgcolor="#E4F7BA" >회원 기본 정보</th>
        </tr>
        <tr>
          <td>아이디</td>
          <td><input type="text" name="id"> 4~12자의 영문 대소문자와 숫자로만 입력</td>
        </tr>
        <tr>
          <td>비밀번호</td>
          <td><input type="password" name="password"> 4~12자의 영문 대소문자와 숫자로만 입력</td>
        </tr>
        <tr>
          <td>비밀번호 확인</td>
          <td><input type="password" name="repeatPassword"></td>
        </tr>
        <tr>
          <td>메일주소</td>
          <td><input type="text" name="mail"> 예)id@domain.com</td>
        </tr>
        <tr>
          <td>이름</td>
          <td><input type="text" name="name"></td>
        </tr>
        <tr>
          <td colspan=2 bgcolor="#E4F7BA" align=center><B>개인 신상 정보</B</td>
        </tr>
        <tr>
          <td>주민등록번호</td>
          <td><input type="text" name="birth"> 예)000000-0000000</td>
        </tr>
        <tr>
          <td>생일</td>
          <td>
            <input type="text" name="year">년
            <select name="month" >
              <option value="01" selected(초기 선택된 항목)>01</option>
              <option value="02">02</option>
              <option value="03">03</option>
              <option value="04">04</option>
             <option value="05">05</option>
             <option value="06">06</option>
             <option value="07">07</option>
             <option value="08">08</option>
             <option value="09">09</option>
             <option value="10">10</option>
             <option value="11">11</option>
             <option value="12">12</option>
          </select>월
          <select name="day">
              <option value="01" selected(초기 선택된 항목)>01</option>
              <option value="02">02</option>
              <option value="03">03</option>
              <option value="04">04</option>
             <option value="05">05</option>
             <option value="06">06</option>
             <option value="07">07</option>
             <option value="08">08</option>
             <option value="09">09</option>
             <option value="10">10</option>
             <option value="11">11</option>
              <option value="12">12</option>
              <option value="13">13</option>
              <option value="14">14</option>
             <option value="15">15</option>
             <option value="16">16</option>
             <option value="17">17</option>
             <option value="18">18</option>
             <option value="19">19</option>
             <option value="20">20</option>
             <option value="21">21</option>
             <option value="22">22</option>
              <option value="23">23</option>
              <option value="24">24</option>
             <option value="25">25</option>
             <option value="26">26</option>
             <option value="27">27</option>
             <option value="28">28</option>
             <option value="29">29</option>
             <option value="30">30</option>
             <option value="31">31</option>
           </select> 일
          </td>
        </tr>
        <tr>
          <td>관심분야</td>
          <td>
            <input type="checkbox" name="favorite" value="컴퓨터">컴퓨터
            <input type="checkbox" name="favorite" value="인터넷">인터넷
            <input type="checkbox" name="favorite" value="여행">여행
            <input type="checkbox" name="favorite" value="영화감상">영화감상
            <input type="checkbox" name="favorite" value="음악감상">음악감상
          </td>
        </tr>
        <tr>
          <td>자기소개</td>
          <td><textarea name="introduceMyself" cols=50 rows=10></textarea>
            </td>
        </tr>
      </table>
      <p align=center>
        <input type="submit" name="join" value="회원 가입">
        <input type="reset" name="reset" value="다시 입력">
      </p>
    </form>
    </body>
</html>


반응형

'Web > HTML_JS_CSS' 카테고리의 다른 글

[Javascript] Script 파일의 위치와 onload..  (2) 2019.01.08
[Javascript] Javascript 사용 방법  (2) 2019.01.08
[css] 선택자  (2) 2019.01.07
[JS] 회원가입 유효성 검사  (1) 2018.08.17
[HTML/JavaScript] 계산기 만들기  (0) 2018.07.30
반응형
<절대경로>
→ 어떠한 웹페이지나 파일이 가지고 있는 고유한 경로
→ ex) http://www.google.com  D:\chung\HTML\workspace 등을 모두 절대 경로라고한다.
→ 사용자가 만약 절대경로를 알고 있으면 그곳으로 바로 이동하거나 그곳에 있는 파일을 바로 실행 가능하다는 것..


<상대경로>
→ 이미지를 삽입할 HTML문서를 기준으로 경로를 인식하는 방법
→ 문서에 이미지를 삽입할 때 문서와 이미지가 같은 폴더 내에 존재하면 아무런 문제가 되지않지만
  같은 폴더에 저장되어있지 않다면 경로를 지정해주어야한다.
ex)
A라는 폴더안에 index.php파일이 위치한다고 가정하고 현재 내가 B라는 폴더에 위치한다면,
A폴더 안에 index.php파일을 가져오기 위해서는 B라는 폴더를 기준으로 계산한다.
따라서 ../A/index.php이라고 하여 index.php로 간다는 것.


- 참고할 것
/ : 루트
./ : 현재위치
../ : 현재 위치의 상단 폴더


반응형

'ETC' 카테고리의 다른 글

[Error] Starting Tomcat v8.5 Server at localhost' has encountered a problem.  (0) 2018.10.11
반응형

타이틀바 없애기



styles.xml 에서


<style> 


1
2
3
        <!--No Title Bar-->
        <item name="windowNoTitle">true</item>
        <item name="windowActionBar">false</item>
cs


</style>



상태바 없애기


Activity onCreate()함수에서 


1
2
3
4
5
6
7
8
9
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
 
        setContentView(R.layout.activity_main);
    }
cs


설정 끝!

반응형

'Android' 카테고리의 다른 글

[Android] 피아노 어플만들기  (0) 2018.08.17
[Android] Open API 사용해서 부산 버스 어플 만들기  (5) 2018.08.17
반응형

미니 플젝으로 피아노 만들어보았다.



HorizontalScrollview에 FrameLayout을 얹고 white keyboard, black keyboard를 배치하였다.


피아노 키에 대해서 잘 모르는 관계로... 저 첫시작 도가 c1인지 c2인지.. 잘 모르겠다..


피아노 음은 일일이 음을 따올수가 없어서 어플 다운받아서 디컴파일하여 음을 가져왔다.


https://apkpure.com/ << 컴퓨터에서 apk파일 다운로드 하는 사이트


디컴파일 하는 방법을 이것 저것 다 시도해보다가


https://www.youtube.com/watch?v=VLsJETb3m4M << 유튜브의 이 영상을 보고 많은 도움을 얻었다.


http://www.javadecompilers.com/ << 영상에서 소개해주는 디컴파일 사이트


(참고로..

평소 음원 확장자를 .mp4나 wav파일만 알고 있어서 이걸로 찾으려니 안찾아졌다..

디컴파일하여 얻은 음원의 확장자는 ogg였다.

ogg란?

------------------------------------------------------------------------------------------------------------------------------------------------

Ogg(오그)는 멀티미디어 컨테이너 포맷이다. 특허권으로 보호되지 않는 오픈 표준 파일 형식으로 멀티미디어 비트스트림을 효율적으로 전송하고 처리할 수 있게 하기 위해 Xiph.Org 재단에서 개발한 것이다.


출처 - 위키백과

------------------------------------------------------------------------------------------------------------------------------------------------

지식 하나 더 얻어간다@_@)


프로젝트 폴더\res폴더에 디컴파일하여 얻은 음원을 raw폴더를 생성하여 여기에 넣어준다.


레이아웃 가로모드 설정하기 위해서 프로젝트 폴더 경로를 따라 res 폴더로 들어가서 한개로 되어있는 layout폴더를



이렇게 두개로 나눠준다.(각각 폴더 안에 xml파일 포함되어 있음.)


결과적으로 안드로이드 스튜디오 가서 폴더를 확인해보면 layout폴더 밑에 actibvity_main(2)라고 설정 되어있는것을 볼 수 있다.




다음은 piano xml, java코드이다.


< activity_main.xml> 

버튼이 많은 관계로 엄청 길다...

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="10"
    tools:context=".MainActivity">
 
    <HorizontalScrollView
        android:id="@+id/sv"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="10">
 
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
 
            <!--White KeyBoard-->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="horizontal">
 
                <ImageButton
                    android:id="@+id/do1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/re1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/mi1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/pa1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/sol1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/ra1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/si1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <!--///////////////////////-->
                <ImageButton
                    android:id="@+id/do2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/re2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/mi2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/pa2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/sol2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/ra2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/si2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <!--///////////////////////-->
 
                <ImageButton
                    android:id="@+id/do3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/re3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/mi3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/pa3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/sol3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/ra3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/si3"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <!--///////////////////////-->
                <ImageButton
                    android:id="@+id/do4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/re4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/mi4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/pa4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/sol4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/ra4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
 
                <ImageButton
                    android:id="@+id/si4"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:onClick="clickedKeyboard"
                    android:padding="0dp"
                    app:srcCompat="@drawable/whitebutton" />
            </LinearLayout>
 
            <!--Black KeyBoard-->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="horizontal">
 
                <ImageButton
                    android:id="@+id/doShap1"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="95dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/reShap1"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/paShap1"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="190dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/solShap1"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/raShap1"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <!--///////////////////////-->
 
                <ImageButton
                    android:id="@+id/doShap2"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="190dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/reShap2"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="69dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/paShap2"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="185dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/solShap2"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/raShap2"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <!--///////////////////////-->
 
                <ImageButton
                    android:id="@+id/doShap3"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="190dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/reShap3"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="69dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/paShap3"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="185dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/solShap3"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/raShap3"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <!--///////////////////////-->
 
                <ImageButton
                    android:id="@+id/doShap4"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="190dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/reShap4"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="69dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/paShap4"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="185dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/solShap4"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
 
                <ImageButton
                    android:id="@+id/raShap4"
                    android:layout_width="wrap_content"
                    android:layout_height="180dp"
                    android:layout_marginLeft="60dp"
                    android:onClick="blackKeyBoardClicked"
                    android:padding="0dp"
                    app:srcCompat="@drawable/blackbutton" />
            </LinearLayout>
        </FrameLayout>
    </HorizontalScrollView>
</LinearLayout>
cs


<MainActivity.java>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
package com.example.sh.piano;
 
import android.content.pm.ActivityInfo;
import android.media.AudioManager;
import android.media.SoundPool;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.WindowManager;
import android.widget.HorizontalScrollView;
import android.widget.ImageButton;
 
 
public class MainActivity extends AppCompatActivity {
 
 
    SoundPool pool;
    //White keyBoard
    int do1, re1, mi1, pa1, sol1, ra1, si1;
    int do2, re2, mi2, pa2, sol2, ra2, si2;
    int do3, re3, mi3, pa3, sol3, ra3, si3;
    int do4, re4, mi4, pa4, sol4, ra4, si4;
    //Black KeyBoard
    int doShap1, reShap1, paShap1, solShap1, raShap1;
    int doShap2, reShap2, paShap2, solShap2, raShap2;
    int doShap3, reShap3, paShap3, solShap3, raShap3;
    int doShap4, reShap4, paShap4, solShap4, raShap4;
 
    private float x, y;
 
    ImageButton doBtn1, reBtn1, miBtn1, paBtn1, solBtn1, raBtn1, siBtn1;
    ImageButton doBtn2, reBtn2, miBtn2, paBtn2, solBtn2, raBtn2, siBtn2;
    ImageButton doBtn3, reBtn3, miBtn3, paBtn3, solBtn3, raBtn3, siBtn3;
    ImageButton doBtn4, reBtn4, miBtn4, paBtn4, solBtn4, raBtn4, siBtn4;
 
 
    private HorizontalScrollView sv;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
 
        setContentView(R.layout.activity_main);
 
        getXmlId();
        loadMusic();
    }
    public void controlScroll(View view) {
        View.OnTouchListener touchListener = new View.OnTouchListener() {
            @Override
            public boolean onTouch(View view, MotionEvent motionEvent) {
                final int action = motionEvent.getAction();
                switch (action & MotionEvent.ACTION_MASK) {
                    case MotionEvent.ACTION_DOWN :
                        // 처음 터치가 눌러졌을 때
                        // TodoList : 해당 건반만 소리 나게 설정
 
                        break;
                    case MotionEvent.ACTION_MOVE:
                        // 터치가 눌린 상태에서 움직일 때
                        // "도레미파솔라시도"처럼 음 소리나게
                        // 스크롤뷰 움직이지 못하게 막기
 
                        break;
                    case MotionEvent.ACTION_UP :
                        // 터치가 떼어졌을 때
                        // 소리안남
 
                        break;
                    case MotionEvent.ACTION_POINTER_DOWN:
                        // 터치가 두 개 이상 && 눌러졌을 때
 
                        // TodoList : 스크롤 움직이기
                        final int pointerIndex = (action & MotionEvent.ACTION_POINTER_INDEX_MASK) >> MotionEvent.ACTION_POINTER_INDEX_SHIFT;
                        // x = getX(pointerIndex);
                        // y = getY(pointerIndex);
                        break;
                }
                return true;
            }
        };
    }
 
    public void clickedKeyboard(View view) {
        switch (view.getId()) {
            //White KeyBoard Id
            case R.id.do1:
                pool.play(do1, 1, 1, 0, 0, 1);
                break;
            case R.id.re1:
                pool.play(re1, 1, 1, 0, 0, 1);
                break;
            case R.id.mi1:
                pool.play(mi1, 1, 1, 0, 0, 1);
                break;
            case R.id.pa1:
                pool.play(pa1, 1, 1, 0, 0, 1);
                break;
            case R.id.sol1:
                pool.play(sol1, 1, 1, 0, 0, 1);
                break;
            case R.id.ra1:
                pool.play(ra1, 1, 1, 0, 0, 1);
                break;
            case R.id.si1:
                pool.play(si1, 1, 1, 0, 0, 1);
                break;
            ////////////////////////////////////////////////////////////
            case R.id.do2:
                pool.play(do2, 1, 1, 0, 0, 1);
                break;
            case R.id.re2:
                pool.play(re2, 1, 1, 0, 0, 1);
                break;
            case R.id.mi2:
                pool.play(mi2, 1, 1, 0, 0, 1);
                break;
            case R.id.pa2:
                pool.play(pa2, 1, 1, 0, 0, 1);
                break;
            case R.id.sol2:
                pool.play(sol2, 1, 1, 0, 0, 1);
                break;
            case R.id.ra2:
                pool.play(ra2, 1, 1, 0, 0, 1);
                break;
            case R.id.si2:
                pool.play(si2, 1, 1, 0, 0, 1);
                break;
            ////////////////////////////////////////////////////////////
            case R.id.do3:
                pool.play(do3, 1, 1, 0, 0, 1);
                break;
            case R.id.re3:
                pool.play(re3, 1, 1, 0, 0, 1);
                break;
            case R.id.mi3:
                pool.play(mi3, 1, 1, 0, 0, 1);
                break;
            case R.id.pa3:
                pool.play(pa3, 1, 1, 0, 0, 1);
                break;
            case R.id.sol3:
                pool.play(sol3, 1, 1, 0, 0, 1);
                break;
            case R.id.ra3:
                pool.play(ra3, 1, 1, 0, 0, 1);
                break;
            case R.id.si3:
                pool.play(si3, 1, 1, 0, 0, 1);
                break;
            ////////////////////////////////////////////////////////////
            case R.id.do4:
                pool.play(do4, 1, 1, 0, 0, 1);
                break;
            case R.id.re4:
                pool.play(re4, 1, 1, 0, 0, 1);
                break;
            case R.id.mi4:
                pool.play(mi4, 1, 1, 0, 0, 1);
                break;
            case R.id.pa4:
                pool.play(pa4, 1, 1, 0, 0, 1);
                break;
            case R.id.sol4:
                pool.play(sol4, 1, 1, 0, 0, 1);
                break;
            case R.id.ra4:
                pool.play(ra4, 1, 1, 0, 0, 1);
                break;
            case R.id.si4:
                pool.play(si4, 1, 1, 0, 0, 1);
                break;
        }
    }
 
    public void blackKeyBoardClicked(View view) {
        switch (view.getId()) {
            //Black KeyBoard Id
            case R.id.doShap1:
                pool.play(doShap1, 1, 1, 0, 0, 1);
                break;
            case R.id.reShap1:
                pool.play(reShap1, 1, 1, 0, 0, 1);
                break;
            case R.id.paShap1:
                pool.play(paShap1, 1, 1, 0, 0, 1);
                break;
            case R.id.solShap1:
                pool.play(solShap1, 1, 1, 0, 0, 1);
                break;
            case R.id.raShap1:
                pool.play(raShap1, 1, 1, 0, 0, 1);
                break;
            ////////////////////////////////////////////////////////////
            case R.id.doShap2:
                pool.play(doShap2, 1, 1, 0, 0, 1);
                break;
            case R.id.reShap2:
                pool.play(reShap2, 1, 1, 0, 0, 1);
                break;
            case R.id.paShap2:
                pool.play(paShap2, 1, 1, 0, 0, 1);
                break;
            case R.id.solShap2:
                pool.play(solShap2, 1, 1, 0, 0, 1);
                break;
            case R.id.raShap2:
                pool.play(raShap2, 1, 1, 0, 0, 1);
                break;
            ////////////////////////////////////////////////////////////
            case R.id.doShap3:
                pool.play(doShap3, 1, 1, 0, 0, 1);
                break;
            case R.id.reShap3:
                pool.play(reShap3, 1, 1, 0, 0, 1);
                break;
            case R.id.paShap3:
                pool.play(paShap3, 1, 1, 0, 0, 1);
                break;
            case R.id.solShap3:
                pool.play(solShap3, 1, 1, 0, 0, 1);
                break;
            case R.id.raShap3:
                pool.play(raShap3, 1, 1, 0, 0, 1);
                break;
            ////////////////////////////////////////////////////////////
            case R.id.doShap4:
                pool.play(doShap4, 1, 1, 0, 0, 1);
                break;
            case R.id.reShap4:
                pool.play(reShap4, 1, 1, 0, 0, 1);
                break;
            case R.id.paShap4:
                pool.play(paShap4, 1, 1, 0, 0, 1);
                break;
            case R.id.solShap4:
                pool.play(solShap4, 1, 1, 0, 0, 1);
                break;
            case R.id.raShap4:
                pool.play(raShap4, 1, 1, 0, 0, 1);
                break;
        }
    }
 
    public void getXmlId() {
        sv = findViewById(R.id.sv);
        doBtn1 = findViewById(R.id.do1);
        reBtn1 = findViewById(R.id.re1);
        miBtn1 = findViewById(R.id.mi1);
        paBtn1 = findViewById(R.id.pa1);
        solBtn1 = findViewById(R.id.sol1);
        raBtn1 = findViewById(R.id.ra1);
        siBtn1 = findViewById(R.id.si1);
        ///
        doBtn2 = findViewById(R.id.do2);
        reBtn2 = findViewById(R.id.re2);
        miBtn2 = findViewById(R.id.mi2);
        paBtn2 = findViewById(R.id.pa2);
        solBtn2 = findViewById(R.id.sol2);
        raBtn2 = findViewById(R.id.ra2);
        siBtn2 = findViewById(R.id.si2);
        ///
        doBtn3 = findViewById(R.id.do3);
        reBtn3 = findViewById(R.id.re3);
        miBtn3 = findViewById(R.id.mi3);
        paBtn3 = findViewById(R.id.pa3);
        solBtn3 = findViewById(R.id.sol3);
        raBtn3 = findViewById(R.id.ra3);
        siBtn3 = findViewById(R.id.si3);
        ///
        doBtn4 = findViewById(R.id.do4);
        reBtn4 = findViewById(R.id.re4);
        miBtn4 = findViewById(R.id.mi4);
        paBtn4 = findViewById(R.id.pa4);
        solBtn4 = findViewById(R.id.sol4);
        raBtn4 = findViewById(R.id.ra4);
        siBtn4 = findViewById(R.id.si4);
    }
 
    public void loadMusic() {
        pool = new SoundPool(4, AudioManager.STREAM_MUSIC, 0);
 
        //WhiteKeyBoard Soundpool
        do1 = pool.load(this, R.raw.do1, 1);
        re1 = pool.load(this, R.raw.re1, 1);
        mi1 = pool.load(this, R.raw.mi1, 1);
        pa1 = pool.load(this, R.raw.pa1, 1);
        sol1 = pool.load(this, R.raw.sol1, 1);
        ra1 = pool.load(this, R.raw.ra1, 1);
        si1 = pool.load(this, R.raw.si1, 1);
        /////////////////
        do2 = pool.load(this, R.raw.do2, 1);
        re2 = pool.load(this, R.raw.re2, 1);
        mi2 = pool.load(this, R.raw.mi2, 1);
        pa2 = pool.load(this, R.raw.pa2, 1);
        sol2 = pool.load(this, R.raw.sol2, 1);
        ra2 = pool.load(this, R.raw.ra2, 1);
        si2 = pool.load(this, R.raw.si2, 1);
        /////////////////
        do3 = pool.load(this, R.raw.do3, 1);
        re3 = pool.load(this, R.raw.re3, 1);
        mi3 = pool.load(this, R.raw.mi3, 1);
        pa3 = pool.load(this, R.raw.pa3, 1);
        sol3 = pool.load(this, R.raw.sol3, 1);
        ra3 = pool.load(this, R.raw.ra3, 1);
        si3 = pool.load(this, R.raw.si3, 1);
        /////////////////
        do4 = pool.load(this, R.raw.do4, 1);
        re4 = pool.load(this, R.raw.re4, 1);
        mi4 = pool.load(this, R.raw.mi4, 1);
        pa4 = pool.load(this, R.raw.pa4, 1);
        sol4 = pool.load(this, R.raw.sol4, 1);
        ra4 = pool.load(this, R.raw.ra4, 1);
        si4 = pool.load(this, R.raw.si4, 1);
 
 
        //BlackKeyBoard Soundpool
        doShap1 = pool.load(this, R.raw.doshap1, 1);
        reShap1 = pool.load(this, R.raw.reshap1, 1);
        paShap1 = pool.load(this, R.raw.pashap1, 1);
        solShap1 = pool.load(this, R.raw.solshap1, 1);
        raShap1 = pool.load(this, R.raw.rashap1, 1);
        /////////////////
        doShap2 = pool.load(this, R.raw.doshap2, 1);
        reShap2 = pool.load(this, R.raw.reshap2, 1);
        paShap2 = pool.load(this, R.raw.pashap2, 1);
        solShap2 = pool.load(this, R.raw.solshap2, 1);
        raShap2 = pool.load(this, R.raw.rashap2, 1);
        /////////////////
        doShap3 = pool.load(this, R.raw.doshap3, 1);
        reShap3 = pool.load(this, R.raw.reshap3, 1);
        paShap3 = pool.load(this, R.raw.pashap3, 1);
        solShap3 = pool.load(this, R.raw.solshap3, 1);
        raShap3 = pool.load(this, R.raw.rashap3, 1);
        /////////////////
        doShap4 = pool.load(this, R.raw.doshap4, 1);
        reShap4 = pool.load(this, R.raw.reshap4, 1);
        paShap4 = pool.load(this, R.raw.pashap4, 1);
        solShap4 = pool.load(this, R.raw.solshap4, 1);
        raShap4 = pool.load(this, R.raw.rashap4, 1);
 
    }
}

cs



마지막으로 구현한 피아노로 연주하는 동영상..ㅎ



반응형

'Android' 카테고리의 다른 글

[Android] 전체화면 전환  (0) 2018.08.17
[Android] Open API 사용해서 부산 버스 어플 만들기  (5) 2018.08.17
반응형

미니 플젝으로 평소에 만들어보고 싶었던 '부산 버스' 어플을 구현하였다.


API는 공공데이터 포털(data.go.kr)에서 받아왔으며 xml로 파싱하여 값을 받아왔다.


api 파싱과 값 뽑아오는 부분에서는 정말 맨땅에 헤딩이어서 이틀 밤샘 삽질하다가 겨우겨우 해결했다ㅠㅠ


http://movie13.tistory.com/1 << 여기 이 블로그에서 많은 도움을 받았다!!


위의 사이트에서 원하는 api를 검색 후 활용신청하고 end point 와 service key를 받아놓는다. 참고문서도 내려받아서 참고하면된다.


UI부분에 좀 더 투자를 하고 싶었지만 값을 받아내는데 급급해서 사진만 넣고 스크롤뷰에 textview만 넣었다..


<레이아웃>



버스번호와 정류장 번호를 입력하면 해당 정류장에 입력한 버스가 언제 도착하는지를 알려준다.



근데.. 제작 다하고 발표하는 날에 치명적인 오류가 발생하였다..



????? 현재시각 오전 11:13 인데 절대 버스가 없을리가 없는데 왜이렇지 하고 코드분석을 했는데...


알고보니


띠용 ...... 이럴수가....


이 상태가 된지 2주가 넘은거같은데 처리 부탁드립니다...(_ _)


아래는 안드로이드에서 작업한 xml과 java코드이다.



<activity_main.xml>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/road"
    android:orientation="vertical"
    android:weightSum="10"
    tools:context=".MainActivity">
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:orientation="vertical">
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="언제 도착하지?"
            android:textColor="#ffffffff"
            android:textSize="40dp" />
    </LinearLayout>
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="4"
        android:orientation="vertical"
        android:weightSum="5">
 
        <EditText
            android:id="@+id/busNum"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2"
            android:background="@null"
            android:ems="10"
            android:hint="버스 번호를 입력해주세요."
            android:inputType="textPersonName"
            android:text=""
            android:textColor="#ffffffff"
            android:textColorHint="#D5D5D5" />
 
        <EditText
            android:id="@+id/stationArsno"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="2"
            android:background="@null"
            android:ems="10"
            android:hint="정류장 번호를 입력해주세요."
            android:inputType="textPersonName"
            android:text=""
            android:textColor="#ffffffff"
            android:textColorHint="#D5D5D5" />
 
 
        <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1"
            android:onClick="search"
            android:text="검색하기" />
    </LinearLayout>
 
 
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="5"
        android:background="@color/colorBlack">
 
        <TextView
            android:id="@+id/showInfo"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text=""
            android:textColor="#ffffffff"
            android:textSize="20dp" />
    </ScrollView>
 
</LinearLayout>
cs


<MainActivity.java>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
package com.example.sh.bus;
 
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.view.WindowManager;
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Toast;
 
import org.xmlpull.v1.XmlPullParser;
import org.xmlpull.v1.XmlPullParserFactory;
 
import java.io.InputStream;
import java.io.InputStreamReader;
import java.net.URL;
import java.util.regex.Matcher;
import java.util.regex.Pattern;
 
public class MainActivity extends AppCompatActivity {
 
    private final String TAG = "myTag";
    private final String key = "WyP9pjBjktC%2Bea2fFObCERMWEwTJGwwsRMr1YeyFGuqKZSnQwmKcnk1n3ZKf6L8UMGjCSZ4HZDCC%2BSQol89tjQ%3D%3D";
    private final String endPoint = "http://61.43.246.153/openapi-data/service/busanBIMS2";
 
    //xml 변수
    private EditText xmlBusNum;
    private EditText xmlStationArsno;
    private TextView xmlShowInfo;
 
    // 파싱을 위한 필드 선언
    private URL url;
    private InputStream is;
    private XmlPullParserFactory factory;
    private XmlPullParser xpp;
    private String tag;
    private int eventType;
 
    // xml의 값 입력 변수
    private String busNum; // 버스 번호
    private String stationArsno = ""; //출발 정류장 arsNo
    private StringBuffer buffer;
    // 데이터 검색
    private String busNumId; // 버스 번호 Id
    private String stationId;// 출발 정류소명 Id
    private String sStationArriveTime; // 버스의 정류장 도착정보
 
    private String car1;
    private String min1;
    private String station1;
    private String car2;
    private String min2;
    private String station2;
 
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //상태바 없애기(FullScreen)
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);
        setContentView(R.layout.activity_main);
 
        //xml 아이디 얻어오기
        getXmlId();
        buffer = new StringBuffer();
    }
    //검색하기 onclick버튼
    public void search(View view) {
        //사용자한테 출발정류장, 도착정류장 알아오기.
        busNum = xmlBusNum.getText().toString();
        stationArsno = xmlStationArsno.getText().toString();
        car1 = min1 = station1 = car2 = min2 = station2 = null;
        buffer = null;
        buffer = new StringBuffer();
        xmlShowInfo.setText("");
 
        //입력값 검사 함수
        if(exmineData()) {
            // 입력값 검사 함수에서 true를 return할 경우 값이 잘못된 것..
            // 종료..
            return;
        }
 
        new Thread(new Runnable() {
            @Override
            public void run() {
                // 검색한 버스 id 얻기
                // 오퍼레이션 2
                getBusId(busNum);
 
                //검색한 정류장 얻기
                //오퍼레이션 1
                getStationId(stationArsno);
 
                //버스가 언제오는지 확인
                //오퍼레이션 5
                userWant(busNumId, stationId);
 
                // UI setText 하는 곳..
                runOnUiThread(new Runnable() {
                    @Override
                    public void run() {
                        Log.d(TAG, car1 + " " + min1 + " " + station1);
                        Log.d(TAG, car2 + " " + min2 + " " + station2);
                        if(car1 == null) {
                            buffer.append("도착 정보 없음");
                        } else {
                            buffer.append("첫번째 차량 도착 정보\n");
                            buffer.append("차량 번호 : " + car1 + " \n");
                            buffer.append("남은 시간 : " + min1 + " 분 \n");
                            buffer.append("남은 구간 : " + station1 + "정거장\n");
                        }
                        // 두번째 도착 차량은 null이 아닐 경우에만 출력
                        if(car2 != null) {
                            buffer.append("-------------------------\n");
                            buffer.append("두번째 차량 도착 정보\n");
                            buffer.append("차량 번호 : " + car2 + " \n");
                            buffer.append("남은 시간 : " + min2 + "분 \n");
                            buffer.append("남은 구간 : " + station2 + "정거장 \n");
                        }
                        xmlShowInfo.setText(buffer.toString());
                    }
                });
            }
        }).start();
    }
 
    //정류소명을 입력하면 정류장 ID를 돌려줌
    /*
     * 오퍼레이션 1
     * 정류소명, 정류소ARS번호를 기준으로 정류소ID, 정류소명, GPS좌표, 정류소구분(일반, 마을)을
     * 조회하는 정류소정보 조회 서비스
     */
    public void getStationId(String station) {
        String stationUrl = endPoint + "/busStop?arsno=" + station + "&serviceKey=" + key;
        Log.d(TAG, "정류장명 -> 정류장Id : " + stationUrl);
 
        try {
            setUrlNParser(stationUrl);
 
            while (eventType != XmlPullParser.END_DOCUMENT) {
                switch (eventType) {
                    case XmlPullParser.START_DOCUMENT:
                        break;
                    case XmlPullParser.START_TAG:
                        tag = xpp.getName();
 
                        if (tag.equals("item")) ; //첫번째 검색 결과
                        else if (tag.equals("bstopId")) {
                            xpp.next();
                            stationId = xpp.getText();
                        } else if (tag.equals("bstopArsno")) ;
                        else if (tag.equals("bstopNm")) ;
                        else if (tag.equals("gpsX")) ;
                        else if (tag.equals("gpsY")) ;
                        else if (tag.equals("stoptype")) ;
                        break;
                    case XmlPullParser.TEXT:
                        break;
                    case XmlPullParser.END_TAG:
                        tag = xpp.getName();
                        if (tag.equals("item")); // 첫번째 검색 결과 종료.. 줄바꿈
                        break;
                } //end of switch~case
 
                eventType = xpp.next();
            } //end of while
        } catch (Exception e) {
            e.printStackTrace();
        }
        //return buffer.toString(); //정류장 이름에 해당하는 id를 넘겨줌
    }
 
    //버스 번호를 입력하면 버스 ID를 돌려줌
    /*
     * 오퍼레이션 2
     * 노선ID, 노선번호를 기준으로 버스종류, 회사이름, 출/도착지, 첫/막차시간, 배차간격을 조회하는 노선정보 조회 서비스
     */
    public void getBusId(String busNum) {
        String busNumUrl = endPoint + "/busInfo?lineno=" + busNum + "&serviceKey=" + key;
        Log.d(TAG,"버스번호 -> 버스id : " + busNumUrl);
 
        try {
            setUrlNParser(busNumUrl);
 
            while (eventType != XmlPullParser.END_DOCUMENT) {
                switch (eventType) {
                    case XmlPullParser.START_DOCUMENT:
                        break;
                    case XmlPullParser.START_TAG:
                        tag = xpp.getName();
 
                        if (tag.equals("item")) ; //첫번째 검색 결과
                        else if (tag.equals("lineId")) {
                            xpp.next();
                            busNumId = xpp.getText();
                        }
                        else if (tag.equals("buslinenum")) ;
                        else if (tag.equals("bustype")) ;
                        else if (tag.equals("companyid")) ;
                        else if (tag.equals("endpoint")) ;
                        else if (tag.equals("stoptype")) ;
                        else if (tag.equals("firsttime")) ;
                        else if (tag.equals("endtime")) ;
                        else if (tag.equals("headway")) ;
                        else if (tag.equals("headwayNorm")) ;
                        else if (tag.equals("headwayPeak")) ;
                        else if (tag.equals("headwayHoli")) ;
                        break;
                    case XmlPullParser.TEXT:
                        break;
                    case XmlPullParser.END_TAG:
                        tag = xpp.getName();
                        if (tag.equals("item")); // 첫번째 검색 결과 종료.. 줄바꿈
                        break;
                } //end of switch~case
                eventType = xpp.next();
            } //end of while
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
 
    /*
     * 오퍼레이션 5
     * 정류소 ID, 노선 ID를 기준으로 실시간 도착정보인 차량번호, 남은 도착시간, 남은 정류장 수
     * 저상버스유무를 인접버스 두 대에 대해 조회하는 노선 정류소 도착정보 조회 서비스
     */
    public void userWant(String busNumId, String stationId) {
        String dataUrl = endPoint + "/busStopArr?bstopid=" + stationId + "&lineid=" + busNumId + "&serviceKey=" + key;
        Log.d(TAG, dataUrl);
 
        try {
            setUrlNParser(dataUrl);
 
            while (eventType != XmlPullParser.END_DOCUMENT) {
                switch (eventType) {
                    case XmlPullParser.START_DOCUMENT:
                        break;
                    case XmlPullParser.START_TAG:
                        tag = xpp.getName();
 
                        if (tag.equals("item")) ; //첫번째 검색 결과
                        else if (tag.equals("carNo1")) {
                            xpp.next();
                            car1 = xpp.getText();
                        } else if (tag.equals("min1")) {
                            xpp.next();
                            min1 = xpp.getText();
                        } else if (tag.equals("station1")) {
                            xpp.next();
                            station1 = xpp.getText();
                        } else if (tag.equals("carNo2")) {
                            xpp.next();
                            car2 = xpp.getText();
                        } else if (tag.equals("min2")) {
                            xpp.next();
                            min2 = xpp.getText();
                        } else if (tag.equals("station2")) {
                            xpp.next();
                            station2 = xpp.getText();
                        }else if (tag.equals("bstopId")) ;
                        else if (tag.equals("nodeNm")) ;
                        else if (tag.equals("companyid")) ;
                        else if (tag.equals("gpsX")) ;
                        else if (tag.equals("gpsY")) ;
                        else if (tag.equals("bustype")) ;
                        else if (tag.equals("lineid")) ;
                        else if (tag.equals("bstopidx")) ;
                        break;
                    case XmlPullParser.TEXT:
                        break;
                    case XmlPullParser.END_TAG:
                        tag = xpp.getName();
                        if (tag.equals("item")); // 첫번째 검색 결과 종료.. 줄바꿈
                        break;
                } //end of switch~case
                eventType = xpp.next();
            } //end of while
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
 
    // 사용자가 입력한 값을 검사하는 함수
    public boolean exmineData() {
 
        // 사용자가 하나 이상의 값을 입력하지 않은 경우
        if (busNum.equals("") || stationArsno.equals("")) {
            Toast.makeText(this, "값을 입력해주세요!", Toast.LENGTH_SHORT).show();
            return true;
        }
 
        //String[] arr = new String[] {busNum, stationArsno};
        String regExp = "([0-9])"; // 입력값은 반드시 숫자여야하므로 정규 표현식으로 설정
        Pattern pattern_symbol = Pattern.compile(regExp);
 
        //버스 번호 유효성 검사
        Matcher matcher_busNum = pattern_symbol.matcher(busNum); // 입력값이 유효하다면 true return
        if(matcher_busNum.find() == false) {
            Toast.makeText(this, "버스 번호를 다시 입력해주세요!", Toast.LENGTH_SHORT).show();
            return true;
        }
        //정류장 번호 유효성 검사
        Matcher matcher_stationArsno = pattern_symbol.matcher(stationArsno); // 입력값이 유효하다면 true return
        if(matcher_stationArsno.find() == false) {
            Toast.makeText(this, "정류장 번호를 다시 입력해주세요!", Toast.LENGTH_SHORT).show();
            return true;
        }
 
        return false; //모든 값이 정상
    }
 
    // Url, XmlPullParser 객체 생성 및 초기화
    public void setUrlNParser(String quary) {
        try {
            url = new URL(quary); //문자열로 된 요청 url을 URL객체로 생성
            is = url.openStream();
 
            factory = XmlPullParserFactory.newInstance();
            xpp = factory.newPullParser();
            xpp.setInput(new InputStreamReader(is, "UTF-8")); //inputStream으로부터 xml입력받기
 
            xpp.next();
            eventType = xpp.getEventType();
        } catch (Exception e) {
 
        }
 
    }
 
    // UI ID 얻는 함수
    public void getXmlId() {
        xmlBusNum = findViewById(R.id.busNum);
        xmlStationArsno = findViewById(R.id.stationArsno);
        xmlShowInfo = findViewById(R.id.showInfo);
    }
}
 
cs


반응형

'Android' 카테고리의 다른 글

[Android] 전체화면 전환  (0) 2018.08.17
[Android] 피아노 어플만들기  (0) 2018.08.17

+ Recent posts

티스토리툴바