코딩하는 핑구

일반적으로 올리는 UWP 소스는 C#, XAML 을 기준으로 합니다.

잘못된 부분이 있거나 궁금하신게 있으면 댓글 달아주세요

기존 올린 예제에 불러온 동영상 파일의 위치 이동 및 크기 조절이 가능한 기능을 덧붙인 예제입니다.

이때, 크기조절은 터치가 가능한 터치 모니터, 스크린에서만 가능합니다

CS

using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

using Windows.UI.Xaml.Media; //UI 이동

// 빈 페이지 항목 템플릿에 대한 설명은 https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x412에 나와 있습니다.

namespace testing
{
    /// <summary>
    /// 자체적으로 사용하거나 프레임 내에서 탐색할 수 있는 빈 페이지입니다.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        //동영상 on,off 변수
        int Mov_open_switch = 0;

        //동영상 이동
        private TranslateTransform dragTranslation_M;

        

        public MainPage()
        {
            this.InitializeComponent();

            //동영상 이동
            dragTranslation_M = new TranslateTransform();
            MediaPlayerPopup.ManipulationDelta += MediaPlayerPopup_ManipulationDelta;
            MediaPlayerPopup.RenderTransform = this.dragTranslation_M;

            //동영상 트랙바
            MOV.AreTransportControlsEnabled = false;

        }


        private async void Media_open_Click(object sender, RoutedEventArgs e)
        {
            if (Mov_open_switch == 0)
            {
                var openPicker = new Windows.Storage.Pickers.FileOpenPicker();

                openPicker.FileTypeFilter.Add(".wmv");
                openPicker.FileTypeFilter.Add(".mp4");
                openPicker.FileTypeFilter.Add(".wma");
                openPicker.FileTypeFilter.Add(".mp3");
                openPicker.FileTypeFilter.Add(".avi");


                var file = await openPicker.PickSingleFileAsync();

                // mediaPlayer is M_right MediaElement defined in XAML
                if (file != null)
                {
                    if (!MediaPlayerPopup.IsOpen) { MediaPlayerPopup.IsOpen = true; }
                    var stream = await file.OpenAsync(Windows.Storage.FileAccessMode.Read);
                    MOV.SetSource(stream, file.ContentType);
                    MOV.AreTransportControlsEnabled = true;
                    MOV.TransportControls.IsZoomButtonVisible = true;
                    MOV.TransportControls.IsZoomEnabled = true;

                    MOV_C.Visibility = Visibility.Visible;
                    Mov_open_switch = 1;
                    MOV.Play();
                }
                else
                {
                    this.textBlock.Text = "Operation cancelled.";
                    Mov_open_switch = 0;
                    return;

                }

            }
            //동영상 닫기
            else
            {
                Mov_open_switch = 0;
                if (MediaPlayerPopup.IsOpen) { MediaPlayerPopup.IsOpen = false; }
                dragTranslation_M.X = 0;
                dragTranslation_M.Y = 0;
            }
        }

        // 동영상 닫기
        private void MOV_C_Click(object sender, RoutedEventArgs e)
        {
            if (MediaPlayerPopup.IsOpen) { MediaPlayerPopup.IsOpen = false; }
            Mov_open_switch = 0;
            dragTranslation_M.X = 0;
            dragTranslation_M.Y = 0;
        }
        
        private void OnMEFullWindowChanged(DependencyObject sender, DependencyProperty dp)
        {
            MediaElement me = (MediaElement)sender;

            if (me != null && dp == MediaElement.IsFullWindowProperty)
            {
                if (me.IsFullWindow == true)
                {
                    MediaPlayerPopup.Visibility = Visibility.Collapsed;
                }
                else
                {
                    MediaPlayerPopup.Visibility = Visibility.Visible;
                }
            }
        }


        

        //동영상 크기조절
        private void MOV_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            MediaPlayerPopup.Width = Window.Current.Bounds.Width;
            MediaPlayerPopup.Height = Window.Current.Bounds.Height;
        }

        private void MediaPlayerPopup_ManipulationDelta(object sender, Windows.UI.Xaml.Input.ManipulationDeltaRoutedEventArgs e)
        {
            dragTranslation_M.X += e.Delta.Translation.X;
            dragTranslation_M.Y += e.Delta.Translation.Y;
            //동영상 크기조절
            ScaleTransformm.ScaleX *= e.Delta.Scale;
            ScaleTransformm.ScaleY *= e.Delta.Scale;
        }
    }
}

XAML

<Page
    x:Class="testing.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:testing"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <Grid>
        <Button x:Name="openMedia" Click="Media_open_Click">동영상 불러오기</Button>
        <TextBlock Width="1" Height="1" VerticalAlignment="Top" HorizontalAlignment="Right" x:Name="textBlock" ></TextBlock>
        <!--동영상-->
        <Popup x:Name="MediaPlayerPopup" VerticalAlignment="Top" HorizontalAlignment="Left" Canvas.ZIndex="5"  Width="720" Height="405"  ManipulationMode="All" >
            <!--VerticalAlignment="Bottom" HorizontalAlignment="Center"-->
            <Grid >
                <Grid ManipulationDelta="MediaPlayerPopup_ManipulationDelta" ManipulationMode="Scale">
                    <MediaElement x:Name="MOV" SizeChanged="MOV_SizeChanged" AreTransportControlsEnabled="True" Height="405" Width="720" ManipulationMode="All" >                        
                        <MediaElement.RenderTransform>
                            <ScaleTransform x:Name="ScaleTransformm" ScaleX="1.0" ScaleY="1.0"/>
                        </MediaElement.RenderTransform>
                    </MediaElement>
                </Grid>
                <!--동영상 닫기-->
                <Button x:Name="MOV_C" Background="White" Click="MOV_C_Click" VerticalAlignment="Top" HorizontalAlignment="Left" >
                    <SymbolIcon Symbol="Cancel"/>
                </Button>
            </Grid>
        </Popup>
    </Grid>
</Page>

ScaleX, ScaleY의 값에 1.0, 1.5 등을 넣음으로써 크기 조절 시 가로, 세로 증감하는 길이에 대한 비율을 정할 수 있다

위의 코드 실행 이미지

참고 사이트

docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.media.scaletransform?view=winrt-19041