티스토리 뷰

반응형

※ webrtc 1.0 버전이 나온 뒤에는 컴파일(libjingle_peerconnection.so파일 등의 생성) 설치 필요없이 의존성 만으로도 빌드가 가능하다.


단, 안드로이드 스튜디오가 3.0 버전 이상이어야 한다.


참조사이트





1. 소스 다운


먼저, 구글 git에서 제공하는 apprtc 샘플 사이트를 방문한다.


https://webrtc.googlesource.com/src/+/master/examples/androidapp/


[tgz]을 클릭하여 최신 예제를 다운로드 받는다.






2. 안드로이드 새 프로젝트를 만들고 gradle에 의존성 추가 및 수정


다음 사이트를 참조하여 모듈 그래들(build.gradle)에서


implementation 'org.webrtc:google-webrtc:1.0.+'


다음과 같이 설정하여 WebRTC 개발을 하기위한 기본 라이브러리를 추가한다.(2018. 06. 16일 기준 1.0.23546 이 최신 버전)


다음으로, 람다식을 쓰기 위해 gradle 설정에 compile옵션을 1.8(자바 8버전) 이상으로 설정한다.(샘플 앱을 만든 사람들이 람다식을 썼음)

※람다식에 대해 궁금하면 여기로


compileOptions {
targetCompatibility 1.8
sourceCompatibility 1.8
}


그후, 1번에서 받았던 tgz 압축 파일을 풀어준다.


third_party > authbanh > lib >authbanh.jar 파일을 안드로이드 프로젝트 안에 넣어준다.

(원래 authbahn.jar 파일인데, 이름이 이상하게 바뀌어서 압축되어있다. 그냥 하자.)

※authbahn.jar 파일은 WebSocket 지원을 위한 라이브러리이다. autobahn 라이브러리가 뭔지 알고싶으면 여기로



(다음을 Project로 바꾸고, app > libs 안에다 넣어준다.)


다음에 Project Structure에다 authbanh.jar 파일을 넣어주거나, gradle에 다음과 같이 적고 Sync Now를 누른다.


implementation files('libs/autobanh.jar')





다음과 같이 한다면 gradle 설정은 완료.







3. 압축 푼 리소스파일의 붙여넣기 및 수정


res(리소스) 폴더 안의 파일들을 옮기자.


①. drawable-xhdpi 폴더 안의 png 파일 모두를 drawable 폴더로 옮김


②. layout 폴더안의 xml 파일 모두를 layout 폴더로 옮김


③. menu 폴더를 통째로 옮김


④. values안의 폴더를 통째로 옮김(Overwrite for all)


⑤. 프로젝트의 style.xml에 다음을 붙여넣음

<style name="CallActivityTheme" parent="android:Theme.Black">
<item name="android:windowActionBar">false</item>
<item name="android:windowFullscreen">true</item>
<item name="android:windowNoTitle">true</item>
</style>

⑥. xml 폴더째로 옮김





이렇게 복사했으면 끝.




4. 매니페스트 파일 수정


압축푼 폴더 내에 AndroidManifest.xml 파일을 붙여넣기 하고 패키지 명만 수정해도 되며, 다음과 같이 해도 무관하다.


uses-feature 및 uses-permission 추가

<uses-feature android:name="android.hardware.camera"/>
<uses-feature android:name="android.hardware.camera.autofocus"/>
<uses-feature android:glEsVersion="0x00020000" android:required="true"/>
<uses-permission android:name="android.permission.CAMERA"/>
<uses-permission android:name="android.permission.CHANGE_NETWORK_STATE"/>
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS"/>
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.BLUETOOTH"/>
<uses-permission android:name="android.permission.INTERNET"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.CAPTURE_VIDEO_OUTPUT"
tools:ignore="ProtectedPermissions" />


<application> </application> 태그 부분을 



<application
android:allowBackup="false"
android:debuggable="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="false"
tools:ignore="HardcodedDebugMode">
<activity
android:name="ConnectActivity"
android:label="@string/app_name"
android:windowSoftInputMode="adjustPan">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
<intent-filter>
<action android:name="android.intent.action.VIEW" />

<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />

<data
android:host="appr.tc"
android:scheme="https" />
<data
android:host="appr.tc"
android:scheme="http" />
</intent-filter>
</activity>
<activity
android:name="SettingsActivity"
android:label="@string/settings_name"></activity>
<activity
android:name="CallActivity"
android:configChanges="orientation|smallestScreenSize|screenSize|screenLayout"
android:label="@string/app_name"
android:screenOrientation="fullUser"
android:theme="@style/CallActivityTheme"></activity>
</application>


다음과 같이 바꿔준다. (앱 이름을 바꾸려면 <application>의 label 부분을 바꿔주세요.)




5. 소스코드(java) 붙여넣기 및 수정


src-master-examples-androidapp > src > org > appspot > apprtc


안에 있는 java 파일들과 util 폴더를 통째로 내 프로젝트로 옮긴다.


클래스들을 열어보면 빨간줄의 압박이 상당하다. 

(git을 통해서 clone을 한것이 아니어서 그런것 같다. 아직 깔끔한 해결방법을 모르니.. 아시면 댓글좀 부탁드립니다.)


먼저, Auto Import 를 설정하고 진행하자.




본격적으로 소스코드의 수정을 시작하겠다.


AppRTCAudioManager 클래스를 예로 들겠다.


위에 보면 다음과 같이 import 된 목록이 있다. 이를 클릭하면 import 목록이 쭉 뜨는데,

import ...


그 중에 다음과 같이 import 패키지 경로가 잘못된 부분을 먼저 지워준다.


import org.appspot.apprtc.util.AppRTCUtils;


이제 import를 시켜줄 차례이다. 다음과 같이 빨간색으로 코드가 칠해져 있는 부분은 import가 안되어서 그렇다.


Alt+Enter를 눌러 자동으로 import class 시켜준다.

Log.d(TAG, "WiredHeadsetReceiver.onReceive" + AppRTCUtils.getThreadInfo() + ": "



Import도 다음 순서대로 시켜줘야 깔끔하게 된다.


Class별 코드 수정 순서


1. AppRTCAudioManager -> 2. AppRTCBluetoothManager 

-> 3. AppRTCProximitySensor -> 4. RoomParametersFetcher 

-> 5. PeerConnectionClient -> 6. WebSocketChannelClient 

-> 7. WebSocketRTCClient -> 8. CallActivity


코드 수정이 다 끝났으면 아무 번호로 영상통화를 시켜보고 appr.tc 홈페이지에 접속하여 잘 나오는지 테스트 해 보자.

(퍼미션 설정은 앱 설정에서 직접 해주자. 안하면 영상통화가 되지 않으니.)


그리고, 툴바의 settings 메뉴로 들어가서 어떤 기능이 있는지 하나하나씩 살펴보도록 하자.


다음은 자바 소스 코드를 분석하고, 그것을 바탕으로 나만의 영상통화 앱을 본격적으로 구현해보도록 하겠다.

반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
more
«   2024/04   »
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
글 보관함