Android

[Android Studio] 비디오 재생 (1)

https.. 2024. 5. 10. 13:15

비디오 재생시키는 액티비티 만들기
 
목록을 만들어 해당 목록을 선택하면 동영상이 재생되도록 재생시키고자 하는 동영상 파일이 있어야 한다.
동영상 제목, 장소, 이미지를 하나의 리니어레이아웃으로 묶을 것.
이것을 3개 만들 것이다.
 
새로운 프로젝트를 생성한다.
File > New > New Project > VideoListApp
 
파일에서 사진을 복사해서 drawable에 붙여 넣는다.
동영상 파일은 기존에 있는 폴더에 넣을 곳이 없기 때문에 새로운 폴더를 만들어 저장시켜야 한다. 
(오디오와 멀티미디어데이터 역시 새로운 폴더에 저장된다.)
 
res > new Directory > raw
소문자로 raw라는 이름의 패키지를 만들어 파일에서 동영상을 복사해 raw에 붙여 넣는다.
* 비디오 파일 앞에 물음표가 있는데 이것은 에뮬레이터를 run 하기 전까지는 볼 수 없다는 것
편집기 상태에서는 동영상을 볼 수 없고 실행을 시켜야만 볼 수 있다.(오디오, 동영상에 해당)
이것은 오류가 아니다.
 
strings.xml(문자열 변수를 모아둔 것)에서 app name을 지우고 원하는 어플 명으로 변경해 준다.
나는 플레이리스트라고 작성하였다.
동영상을 3개 넣어줄 것이기 때문에 01 02 03으로 나누어 작성한다.
이미지와 동영상은 저장한 파일명과 같게 작성해야 한다.

<resources>
    <string name="app_name">플레이리스트</string>

    <string name="title01">밤의 분수대</string>
    <string name="place01">예술의 전당</string>
    <string name="image01">img_fountain_night</string>
    <string name="video01">fountain_night</string>

    <string name="title02">작은 계곡</string>
    <string name="place02">양평</string>
    <string name="image02">img_creek_rock</string>
    <string name="video02">creek_rock</string>

    <string name="title03">길 위의 폭포</string>
    <string name="place03">청계천</string>
    <string name="image03">img_waterfall_street</string>
    <string name="video03">waterfall_street</string>
</resources>

 
 
테두리 표현은 shape_list에 작성할 것이다.
shape_list를 drawable에 작성한다. 모양.. 도형이기 때문에 drawable에 들어간다.

<?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"
    tools:context=".MainActivity">
</LinearLayout>

 
 
activity_main.xml에서 두 번째 줄 뭐 이상한 거 다 지우고 리니어레이아웃으로 바꿔준다.
방향을 주는 속성은 오리엔테이션.. 이걸 버티컬로 준다.
그룹 만들어줄 때.. 여러 개의 뷰를 하나로 만들어줄 때 쓰는 컨테이너 용도의 뷰는 리니어레이아웃 사용
리니어레이아웃을 만들어 그 안에 텍스트뷰 이미지뷰를 만든다.
오리엔테이션은 호라이즌틀..
 
이제 이미지 뷰 추가..
텍스트뷰 추가..
밤의 분수대, 예술의 전당 즉 텍스트뷰 2개를 세로로 배치하려면 하나의 리니어레이아웃에 담아야 한다.
리니어레이아웃 안에 서브 리니어레이아웃

<?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:padding="16dp"

    tools:context=".MainActivity">

    <!-- 첫 번째 메뉴 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/menu01"
        android:clickable="true"
        android:onClick="ShowVideo"
        android:tag="01"
        android:background="@drawable/shape_list">
        <ImageView
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_fountain_night"
            android:layout_marginRight="15dp"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="vertical">
            <TextView
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:text="@string/title01"
                android:textStyle="bold"
                android:layout_marginBottom="15dp"
                android:textColor="#61380B"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/place01"/>
        </LinearLayout>
    </LinearLayout>

    <!-- 두 번째 메뉴 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/menu02"
        android:clickable="true"
        android:onClick="ShowVideo"
        android:tag="02"
        android:background="@drawable/shape_list">
        <ImageView
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_creek_rock"
            android:layout_marginRight="15dp"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="vertical">
            <TextView
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:text="@string/title02"
                android:textStyle="bold"
                android:layout_marginBottom="15dp"
                android:textColor="#61380B"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/place02"/>
        </LinearLayout>
    </LinearLayout>

    <!-- 세 번째 메뉴 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/menu03"
        android:clickable="true"
        android:onClick="ShowVideo"
        android:tag="03"
        android:background="@drawable/shape_list">
        <ImageView
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_waterfall_street"
            android:layout_marginRight="15dp"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="vertical">
            <TextView
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:text="@string/title03"
                android:textStyle="bold"
                android:layout_marginBottom="15dp"
                android:textColor="#61380B"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/place03"/>
        </LinearLayout>
    </LinearLayout>


</LinearLayout>

 
 
레이아웃 하나 더 만들어야 한다. 클릭하면 동영상 나오도록(다른 화면)
액티비티 메인 복사해서 레이아웃에 복붙 하고, 이름은 playvideo로 바꾼다. 텍스트뷰.. 제목추가

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/title"
    android:background="@drawable/shape_list"
    android:layout_marginBottom="40dp"/>

 
동영상 넣는 것, 비디오뷰 VideoView ((오디오는 뷰가 없다.))

<VideoView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/video"/>

 
툴 위에 추가

android:clickable="true"
android:onClick="goBack"
android:id="@+id/videolayout"

 
playvideo 총 코드이다.

<?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:padding="16dp"

    android:clickable="true"
    android:onClick="goBack"
    android:id="@+id/videolayout"

    tools:context=".MainActivity">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/title"
        android:background="@drawable/shape_list"
        android:layout_marginBottom="40dp"/>

    <VideoView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/video"/>
    
</LinearLayout>

 
 
이제 자바 파일을 만들어야 한다.
메인액티비티밑에 ShowVideo 만들기
메인액티비티와 코드 동일하지만, activity_main를 playvideo로 변경한다.
ShowVideo는 누르면 동영상으로 보이게 하기 위함이다.
 
ShowVideo 메서드를 메인에 지정해야 한다.

public void ShowVideo(View view){
    
} // ShowVideo

 
액티비티==자바==클래스 다 같은 말이다.
안드로이드매니페스트를 열어서 메인액티비티 말고 쇼비디오가 추가됐다는 것을 알려야 한다.

<activity android:name=".ShowVideo"></activity>

 
 

Intent it = new Intent(this, ShowVideo.class);
startActivity(it);

쇼비디오클래스로 갈 수 있도록 인텐트 해줘야 한다.
 
여기에 살을 더 붙여서 수정한다. 인텐트 할 때 넣어서 보내야 하기 때문이다.
클릭한 뷰에 해당하는 뷰는 리니어레이아웃

int id = view.getId();
LinearLayout layout = (LinearLayout) findViewById(id);

String tag = (String) layout.getTag();

스트링이라는 태그라는 변수에 getTag()로 tag값 읽어 들인다. 형이 같아야 하기 때문에 괄호에 String을 넣어준다.
LinearLayout layout = () 여기에서 괄호: 형변환 뷰를 연결하기 위해서는 같은 타입으로 형변환이 이루어져야 한다.
 

it.putExtra("it_tag", tag);

이제 it를 보낼 것이다. 태그사용, it_tag라는 이름 붙여서 보낸다.
인텐트 부분 

Intent it = new Intent(this, ShowVideo.class);
it.putExtra("it_tag", it);
startActivity(it);

 
 
이제 다시 ShowVideo로 이동하여 객체를 선언한다. 리니어레이아웃 클래스 타입으로

public class ShowVideo extends AppCompatActivity {
    LinearLayout layout;
    TextView title;
    VideoView video;

 
그리고 밑에 findViewByID()로 연결

layout = (LinearLayout) findViewById(R.id.videolayout);
title = (TextView) findViewById(R.id.title);
video = (VideoView) findViewById(R.id.video);

 
Resources res = getResources();
리소스를 가져온다.
우리한테 왔으니 열어야 한다.
그 안에 태그가 들어있기 때문이다.
인텐트 클래스 타입으로 아이티라는 객체를 Intent it = getIntent();
정보를 가져온다. 정보는 스트링타입으로 되어있음 String tag = it.getStringExtra("it_tag");
title 몇 번에 해당하는 이름을 가져오려면 앞에 스트링에 있는 (string.xml의 스트링) 변수 태그와 연결한다.

int title_id = res.getIdentifier("title" + tag, "string", getPackageName());

string에서 title+tag에 해당하는 이름을 찾는다.(여기서는 괄호 안에 넣은 것)
 

String title_str = res.getString(title_id);
title.setText(title_str);

title_str은 타이틀이라는 객체에 지정해야 하기 때문에 사용한다.(이때 사용하는 것 setText)
 
 
 
해당 프로젝트의 코드
 
AndriodManifest.xml

package com.example.videolistapp;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;

public class MainActivity extends AppCompatActivity {

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

    public void ShowVideo(View view){
        int id = view.getId();
        LinearLayout layout = (LinearLayout) findViewById(id);
        String tag = (String) layout.getTag();

        Intent it = new Intent(this, ShowVideo.class);
        it.putExtra("it_tag", tag);
        startActivity(it);
    } // ShowVideo
}

 
 
java > MainActiviy

package com.example.videolistapp;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;

public class MainActivity extends AppCompatActivity {

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

    public void ShowVideo(View view){
        int id = view.getId();
        LinearLayout layout = (LinearLayout) findViewById(id);
        String tag = (String) layout.getTag();

        Intent it = new Intent(this, ShowVideo.class);
        it.putExtra("it_tag", tag);
        startActivity(it);
    } // ShowVideo
}

 
 
java > ShowVideo

package com.example.videolistapp;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.content.res.Resources;
import android.os.Bundle;
import android.widget.LinearLayout;
import android.widget.TextView;
import android.widget.VideoView;

public class ShowVideo extends AppCompatActivity {
    LinearLayout layout;
    TextView title;
    VideoView video;

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

        layout = (LinearLayout) findViewById(R.id.videolayout);
        title = (TextView) findViewById(R.id.title);
        video = (VideoView) findViewById(R.id.video);

        Resources res = getResources();
        Intent it = getIntent();
        String tag = it.getStringExtra("it_tag");

        int title_id = res.getIdentifier("title" + tag, "string", getPackageName());
        String title_str = res.getString(title_id);
        title.setText(title_str);
    }
}

 
 
res > drawable >shape_list

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="#1061300B"></solid>

    <stroke android:width="1dp"
        android:color="#61380B"/>

    <padding android:left="10dp"
        android:right="10dp"
        android:top="5dp"
        android:bottom="5dp"/>

    <corners android:radius="20dp"/>

</shape>

 
 
res > layout > activity_main.xml

<?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:padding="16dp"

    tools:context=".MainActivity">

    <!-- 첫 번째 메뉴 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/menu01"
        android:clickable="true"
        android:onClick="ShowVideo"
        android:tag="01"
        android:background="@drawable/shape_list">
        <ImageView
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_fountain_night"
            android:layout_marginRight="15dp"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="vertical">
            <TextView
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:text="@string/title01"
                android:textStyle="bold"
                android:layout_marginBottom="15dp"
                android:textColor="#61380B"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/place01"/>
        </LinearLayout>
    </LinearLayout>

    <!-- 두 번째 메뉴 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/menu02"
        android:clickable="true"
        android:onClick="ShowVideo"
        android:tag="02"
        android:background="@drawable/shape_list">
        <ImageView
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_creek_rock"
            android:layout_marginRight="15dp"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="vertical">
            <TextView
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:text="@string/title02"
                android:textStyle="bold"
                android:layout_marginBottom="15dp"
                android:textColor="#61380B"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/place02"/>
        </LinearLayout>
    </LinearLayout>

    <!-- 세 번째 메뉴 -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:id="@+id/menu03"
        android:clickable="true"
        android:onClick="ShowVideo"
        android:tag="03"
        android:background="@drawable/shape_list">
        <ImageView
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:adjustViewBounds="true"
            android:src="@drawable/img_waterfall_street"
            android:layout_marginRight="15dp"/>
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:orientation="vertical">
            <TextView
                android:layout_width="150dp"
                android:layout_height="wrap_content"
                android:adjustViewBounds="true"
                android:text="@string/title03"
                android:textStyle="bold"
                android:layout_marginBottom="15dp"
                android:textColor="#61380B"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/place03"/>
        </LinearLayout>
    </LinearLayout>


</LinearLayout>

 
 
res > layout > playvideo.xml

<?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:padding="16dp"

    android:clickable="true"
    android:onClick="goBack"
    android:id="@+id/videolayout"

    tools:context=".MainActivity">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/title"
        android:gravity="center"
        android:textStyle="bold"
        android:background="@drawable/shape_list"
        android:layout_marginBottom="40dp"/>

    <VideoView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/video"/>

</LinearLayout>

 
 
res > values > strings.xml

<resources>
    <string name="app_name">하이유 플레이리스트</string>

    <string name="title01">밤의 분수대</string>
    <string name="place01">예술의 전당</string>
    <string name="image01">img_fountain_night</string>
    <string name="video01">fountain_night</string>

    <string name="title02">작은 계곡</string>
    <string name="place02">양평</string>
    <string name="image02">img_creek_rock</string>
    <string name="video02">creek_rock</string>

    <string name="title03">길 위의 폭포</string>
    <string name="place03">청계천</string>
    <string name="image03">img_waterfall_street</string>
    <string name="video03">waterfall_street</string>
</resources>

'Android' 카테고리의 다른 글

[Android Studio] 인물 정보 입력 & 등록하기 (2)  (0) 2024.05.11
[Android Studio] 인물 정보 입력 & 등록하기 (1)  (0) 2024.05.11
[Android Studio] 비디오 재생 (2)  (0) 2024.05.10
[Android Studio] 아이콘 바꾸는 방법  (0) 2024.05.09
[Android Studio] 안드로이드 스튜디오 버전 지정 설치 방법  (0) 2024.05.09

'Android'의 다른글

  • 현재글[Android Studio] 비디오 재생 (1)

관련글

티스토리툴바