코딩하는 핑구

세 자리수의 자연수 3개의 곱셈의 결과에 포함된 0~9까지의 숫자를 한줄 한줄 차례대로 출력하는 문제

처음에는 숫자를 문자열로 바꿔가지고 하나씩 잘라서 출력해야되나 했는데

최근에 특정 숫자로로 나눈 나머지를 사용하는 방법이 많았어서

크기가 10인 0~9까지의 정수형 배열을 만든다음, 값을 0으로 초기화 시키고

3개의 수를 곱한 결과를 10으로 나눈 나머지의 위치에 ++; 증감연산자를 사용해서 해당 하는 숫자를 1씩 증가시킨 뒤

반복문으로 0~9까지의 배열을 돌아가며 값을 모두 출력해주기로 했다

10으로 나눌때 몫이 1이상일때까지 반복하도록 while 문을 사용했음

따라서 10보다 작은 수인 0~9까지의 값이 나온다면 

미리 만들어준 배열의 값을 1씩 증가시킴

#include <bits/stdc++.h>
using namespace std;

//BOJ 2577

int main() {
	int a,b,c;
	cin >> a>> b >> c;
    
	int n = a*b*c;
	int arr[10]={0};
	int tmp=0;
    
	while(n/10>0){
		tmp = n%10;
		n/=10;
		arr[tmp]++;
	}
    
	arr[n]++;
    
	for(int i=0; i<10; i++){
		cout << arr[i] << "\n";
	}
    
	return 0;
}

위의 코드를 좀더 줄여봄

2가지 정도를 단순화했음

1. n을 10으로 나눈 나머지(n%10)의 값을 배열의 인덱스에 바로 쓸수있었다

2. while문의 조건을 변경해봄 (마지막에 n의 값을 반복문 바깥에서 저장해줬어야했는데 반복문 내에서 모두 처리하도록 함)

1 -> tmp 변수를 따로 선언해서 사용했는데 바로 인덱스로 사용가능하길래 줄임

2-> while문을 사용할 때 n(세 자연수의 곱셈 값)의 값을 10으로 나눈 몫이 0보다 클때까지 반복시켰는데

이런식으로 하면 while문이 종료되고 마지막에 따로 n의 값을 한번 더 저장해줘야돼서

반복문 하나로 다 처리하고싶어서 while 의 조건을 n/10 >0이 아니라 n>10으로 수정했다

#include <bits/stdc++.h>
using namespace std;

int main() {
	int a,b,c;
	cin >> a>> b >> c;
    
	int n = a*b*c;
	int arr[10]={0};
	
	while(n>0){
		arr[n%10]++;
		n/=10;
	}
	for(int i=0; i<10; i++){
		cout << arr[i] << "\n";
	}
	return 0;
}

출처 : www.acmicpc.net/problem/2577

백준 더하기 사이클 문제 풀이

입력한 값 n을 이용해서 x,y를 만들고 (x=n/10, y=n%10)

새롭게 만들어진 값 (임시 저장 값) tmp = (y + (x+y+의 10으로 나눈 나머지 값))을 입력값 n과 같아질 때까지 반복

26을 예로 들면

26 (x=2, y=6)

-> 2+6 = 8

-> (x+y)

tmp = 68

-> (10*y + (x+y)%10)

= 6*10 + (8)%10 과 같다

이 과정을  4번 반복하면 기존 입력한 값인 26이 나옴

구현은

이러한 루틴을 통해서 입력받은 값 26과 중간 과정 값이 일치할 때까지 while문 조건에 넣어서 반복시켰다

예제 값인 26을 입력했을때, 처음에 횟수를 출력할 cnt가 3이 나와서 뭐지했는데

이미 앞에서 tmp를 더한걸 추가해주지않아서 1보다 작은값이 나옴 ㅎ

#include<bits/stdc++.h>
using namespace std;
//BOJ 1110

int main() {
	int n = 0;
	int cnt = 0;    
	cin >> n;
    
	int x = n/10;
	int y = n%10;
    
	int tmp = y*10+(x+y)%10;
    
	cnt++;
    
	while(tmp!= n){
		x = tmp/10;
		y = tmp%10;
		tmp = y*10+(x+y)%10;
		cnt++;
	}
	
    cout<<cnt;
	
    return 0;
}

출처 : www.acmicpc.net/problem/1110

   472

 * 385

 ㅡㅡㅡ

  2360 = (472*5)

 3776  = (472*8*10)

1416   = (472*3*100)

ㅡㅡㅡㅡ

181720 = (472*385)

2360은 단순하게 472와 5의 곱셈으로 표현이 가능하다

385에서 5를 추출해내는 방법은 10으로 나눈 나머지가 제일 간편하다고 생각

3776은 472*8의 값으로 실제 우리가 곱셈을 할 때는 80의 곱셈에서 10을 생략한 값을 쓰니까

385에서 8을 추출해내서 곱셈 값을 출력해줌

1416은 472*3과 같으므로 385를 100으로 나눈 몫을 사용했다

마지막 총합인 181720은 처음에 출력 값에 저 모든 값을 더했는데

생각해보니 그냥 곱셈값을 적으면 되는거라 더 단순하게 수정함

#include<bits/stdc++.h>

using namespace std;
int main (){
	
	int a,b;
	cin >> a;
	cin >> b;
	cout << a*(b%10) << "\n";
	cout << a*((b/10)%10) << "\n";
	cout << a*(b/100) << "\n";
	cout << a*b;
	return 0;
}

www.acmicpc.net/problem/2588

백준에 올라와있는 문제 중 윤년 문제 풀이

4의 배수이면서, 100의 배수가 아니거나 400의 배수인 경우, 윤년이라고 볼 수 있다

따라서 4로나눈 나머지가 0 임과 동시에 400으로 나눈 나머지가 0

또는 100으로 나누었을 경우 나머지가 0이 아니어야 한다

#include<bits/stdc++.h>
using namespace std;

int main (){

	int N=0;
	cin >> N;
    
	if(N%4 == 0 && (N%400==0 || N%100 !=00)){
		cout << 1;
	}
	else{
		cout << 0;
	}
    
	return 0;
}

www.acmicpc.net/problem/2753

파이썬을 다시 사용해보려던 차에 버전이랑 설치 경로를 까먹어서 찾아본 김에 적어봄

1. 설치한 파이썬 버전 확인하는 법

1) cmd에서 파이썬 버전을 확인하는 법

C:\Users\Username>python --version

2) python 인터프리터에서 버전 확인하는 법

C:\Users\Username>python
import sys
print(sys.version)

cmd에 python을 입력하면 파이썬 인터프리터로 넘어감

위의 2가지 방법으로 내가 설치한 파이썬 버전은 3.8.2인것을 알수있다

2. 파이썬 설치된 경로 확인하는 법

1) cmd에서 파이썬 설치 경로를 확인하는 법

C:\Users\Username\where python

2) python 인터프리터에서 설치 경로를 확인하는 법

C:\Users\Username>python
import os
import sys
os.path.dirname(sys.executable)

출처 : 스택오버플로우

※오타가 있을 수 있으니 그런 경우 이미지를 참고해주시길 바랍니다.

자바스크립트로 현재의 연, 월, 일을 출력하는 date() 사용법

딱히 html DOM 요소를 사용하진 않고 그냥 자바스크립트 내 콘솔로 찍어보았다

현재 서버에 파일 업로드 시, 새로고침되는 부분에 지연이 발생하여

혼란와서 오늘 날짜 출력해서 업로드 실시간으로 됐는지 인식할 용도로 씀

html 페이지가 로드되면 바로 수행되게 함

window.onload = function() { 

	var today = new Date();
	var dd = String(today.getDate()).padStart(2, '0');
	var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
	var yyyy = today.getFullYear();

	today = yyyy+ '.' + mm + '.' + dd ;
	
	console.log("오늘은 "+today+" 입니다");
    
    }

출력 예시

"오늘은 2021.01.27 입니다"

출처 : stackoverflow.com/questions/1531093/how-do-i-get-the-current-date-in-javascript

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

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

오늘은 UWP로 windows10 OS를 사용하는 PC, 노트북에 연결된 웹 카메라의 화면을 불러오는 방법과

추가적으로 불러온 웹 캠 화면의 이동과 크기조절을 할 수 있는 예제를 올려본다

웹카메라를 불러올 때, 종료할 때 각각 Loading, Closing 텍스트 문구를 추가해서 진행 상태를 표기했다.

캠화면 크기 조절 시의 비율은 ScaleX, ScaleY를 각각 1.0으로 주어 가로, 세로 동시에 1:1 비율로 늘어나게 함

캠 화면을 불러올 때 Captureelement의 stretch속성을 fill로 주어서 개체에 꽉찬 화면으로 보이게했다

+캠 이동 중 화면 밖으로 나간 경우, 화면 테두리에 쿠션을 주어 막는 방법 대신

캠화면을 다시 불러왔을 때 고정 좌표에 카메라 화면을 띄우도록했다.

코드 보기 앞서

UI 조작 관련 내용이 낯선 사람들은 내가 이해한 대로 간략하게 적어봤으니 참고하길 바람

개체에 대한 이동, 크기조절, 회전 등의 조작을 가능하게 하는 것 - ManipulationDelta

개체에 대한 크기 조절 - RenderTransform

cs 코드

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

using Windows.UI.Popups; // 팝업 메세지
using Windows.Media.Capture; //카메라 화면
using Windows.UI.Xaml.Media; //카메라 화면 UI 이동
using Windows.UI.Xaml.Input; //카메라 화면 UI 이동, 조작 시

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

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

        MediaCapture _mediaCapture = new MediaCapture();

        private TranslateTransform dragTranslation;

        public MainPage()
        {
            this.InitializeComponent();

            Cam_grid.Visibility = Visibility.Collapsed;

            dragTranslation = new TranslateTransform();
            Cam_grid.ManipulationDelta += Cam_grid_ManipulationDelta;            
            Cam_grid.RenderTransform = this.dragTranslation;
        }

        async private void Webcam_Click(object sender, RoutedEventArgs e)
        {
            if (Cam_switch == 0)
            {
                var devices = await Windows.Devices.Enumeration.DeviceInformation.FindAllAsync(Windows.Devices.Enumeration.DeviceClass.VideoCapture);

                if (devices.Count < 1)
                {
                    var msg_cam = new MessageDialog("연결된 카메라가 없습니다");
                    await msg_cam.ShowAsync();
                    return;
                }
                else
                {
                    _mediaCapture = new MediaCapture();

                    try
                    {
                        dragTranslation.X = 5;
                        dragTranslation.Y = 5;

                        Cam_close.Visibility = Visibility.Collapsed;
                        Cam_grid.Visibility = Visibility.Visible;
                        Cam_load.Visibility = Visibility.Visible;

                        await _mediaCapture.InitializeAsync();

                        PreviewControl.Source = _mediaCapture;

                        await _mediaCapture.StartPreviewAsync();

                        Cam_switch = 1;

                        Cam_load.Visibility = Visibility.Collapsed;
                    }

                    catch (System.Exception)
                    {
                    }
                }
            }
            else
            {
                dragTranslation.X = 5;
                dragTranslation.Y = 5;

                Cam_close.Visibility = Visibility.Visible;
                PreviewControl.Source = null;
                await _mediaCapture.StopPreviewAsync();

                Cam_grid.Visibility = Visibility.Collapsed;

                Cam_switch = 0;

                Cam_scale.ScaleX = 1;
                Cam_scale.ScaleY = 1;
                Cam_bd_scale.ScaleX = 1;
                Cam_bd_scale.ScaleY = 1;

            }
        }

        private void Cam_grid_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
        {
            dragTranslation.X += e.Delta.Translation.X;
            dragTranslation.Y += e.Delta.Translation.Y;
            Cam_scale.ScaleX *= e.Delta.Scale;
            Cam_scale.ScaleY *= e.Delta.Scale;
            Cam_bd_scale.ScaleX *= e.Delta.Scale;
            Cam_bd_scale.ScaleY *= e.Delta.Scale;
        }
    }
}

 웹 캠 화면을 닫고나서 PreviewControl.Source (=리소스)를 null로 줌

xaml 코드

<Page
    x:Class="test.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:test"
    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="Webcam" Click="Webcam_Click">
            <SymbolIcon Symbol="Camera"></SymbolIcon>
        </Button>
        <Grid Name="Cam_grid"  Margin="0,49,0,0" CanDrag="False" Canvas.ZIndex="11" VerticalAlignment="Top" ManipulationMode="All" Width="420" Height="350"  HorizontalAlignment="Left" >
            <TextBox Name="Cam_load" Text="Loading..."/>
            <CaptureElement   Name="PreviewControl"  CanDrag="False" Stretch="Fill" ManipulationMode="All" >
                <CaptureElement.RenderTransform>
                    <ScaleTransform x:Name="Cam_scale" ScaleX="1.0" ScaleY="1.0" />
                </CaptureElement.RenderTransform>
            </CaptureElement>
            <Border BorderBrush="SkyBlue" BorderThickness="2" >
                <Border.RenderTransform>
                    <ScaleTransform x:Name="Cam_bd_scale" ScaleX="1.0" ScaleY="1.0" />
                </Border.RenderTransform>
            </Border>
            <TextBox Name="Cam_close" Text="Closing..." />
        </Grid>
    </Grid>
</Page>

예시 사진

먼저 카메라에 접근하기 위해서는 어플리케이션을 다운받고 연락처나 카메라 접근 허가해주듯 허가 요청에 대한

명시가 따로 필요한데 이것을 manifest라고 부름

따라서 UWP 또한 접근할 기능에 대한 앱 매니페스토 허용이 필요하여 우측의 솔루션 탐색기에서

Package.appxmanifest 파일을 더블클릭하여 수정을 해주면된다

상단의 기능탭을 클릭하여 웹캠, 마이크를 체크해준 다음 프로그램 빌드/디버그를 진행해서 테스트하면 된다.

실행 시 카메라 아이콘을 입혀둔 버튼을 확인할 수 있다

아담한 저 버튼을 클릭하면 연결한 웹캠의 화면이 이제 나타난다

버튼 클릭 후 액세스 허용을 해준다면 말이지

액세스 허용 시 나타나는 화면

불러온 카메라 리소스를 이동시켜줌

+연결된 카메라를 확인 후 카메라 연결이 없을 때 나타나는 팝업 창

앞에서 허용해준 앱 액세스 값 변경하는 법

윈도우의 기본 설정값을 변경해주면 된다

과정은 다음과 같으니 액세스 허용 후에 관한 변경사항이 필요할 경우, 참고하길 바람

참고사이트

docs.microsoft.com/ko-kr/windows/uwp/audio-video-camera/basic-photo-video-and-audio-capture-with-mediacapture

안드로이드, 자바는 처음인데

최근 시간적 여유도 생기고 만들어보고싶은 어플도 생겨서 친구와 함께 스터디로 어플 제작 시작하기로 함

개발 툴 설치는 항상 뭐가 복잡한데 안드로이드 스튜디오는 그나마 덜한듯 (어디까지나 설치만 진행했을경우임)

설치과정은 다음과 같음

이미지 휘리릭 보면 간단하니 바로 아래 링크로 들어가서 다운받아 실행하자

developer.android.com/studio/install?hl=ko

표시된 칸 클릭 시 바로 다운로드 파일을 받을 수 있는 사이트로 이동함

다운로드 클릭

동의 후 다운로드된 셋업파일을 실행하자

바로가기 만들지 않으려면 밑에 Do not create shortcuts 체크

Finish라고 하지만 이게 끝이 아님

기존 세팅이 있는지 여부를 묻는듯 한데 처음설치이므로 그냥 하단의 두낫으로 감

구글에 너의 개발 특성을 샅샅히 전달하고 싶으면 왼쪽 아니면 오른쪽하면 될듯

초보자가 으딜감히 커스텀을

무난하게 스탠다드로 ㄱㄱ

나는 주기적으로 안구검진을 받는 눈이라서 왼쪽을 사용함

총 다운해야할 용량은 1.69GB정도이며 하드에 충분한 용량을 갖고있지 않으면 설치 중간에 설치가 중단되니

여유공간을 만들어두고 시작하자

설치가 완료되면 볼수있는 화면

이제 안드로이드 예제 파일을 이거저거 시작해보자

지금이야 익숙해져서 뚝딱해서 프로젝트를 시작할 수 있지만

처음 uwp를 접했을때는 버전도 골라야해서 약간 막막함이 있었다

그래서 아예 이미지로 정리해봤음

※이 글은 C#, Xaml을 이용하여 UWP를 시작하려는 사람에게 최적화 되어있습니다

UWP (Universal Windows Platform)

목적 : 윈도우 10, 윈도우 10 모바일, 엑스박스 원, 홀로렌즈에서 실행할 유니버셜 앱의 개발을 돕기 위해 제작되어짐

윈도우 10 OS로 구동되는 디바이스에서 사용이 가능한 앱

※유니버설 앱(Universal App) : 하나의 프로젝트에서 개발한, 데스크톱, 모바일, 태블릿 등 모든 기기와 운영체제를 아우르는 서비스 또는 앱을 의미

ex) 한 번 개발하면 화면 크기에 따라 UI가 자동으로 변하고, 디스플레이 크기와 기기에 따른 파편화된 사용자 경험을 합칠 수 있다는 장점이 있다.

지원 개발 언어

• XAML UI 및 C#, VB 또는 C++
• DirectX UI 및 C++
• JavaScript 및 HTML
• WinUI

Visual C# 클릭 후 비어있는 앱 (유니버셜 Windows) 선택

대상버전은 1809와 최소버전은 Creators Update인 15063을 사용하고 있는데

처음 uwp를 다룰 때 이 최소버전 지정을 잘못해서 피시에서 실행이 안된적이 있었어서

요즘은 이렇게 주로 하고있다 원래 사용했던 버전에서 윈도우 업데이트 이후 문제가 생긴다면

웬만하면 버전 관련 문제일 확률이 높다

자세한 사항이 궁금하면 좌측 하단부에 있는 버전 선택에 대한 설명이 있으니 아래 사이트를 참고하자

docs.microsoft.com/ko-kr/windows/uwp/updates-and-versions/choose-a-uwp-version?ocid=VSClient_VerX_NewProject_version

주로 이런 설명이 있으니 업데이트 버전을 대략적으로 파악하기에 좋을듯하다 (아직은 잘 모르겠음)

버전을 지정하고 확인을 누르면 프로젝트가 생성된 모습을 확인할 수 있음

프로젝트 생성이 완료되어 우측의 솔루션 탐색기를 이용해서 MainPage.xaml, MainPage.xaml.cs 의 코드에 접근이

가능하니 이제 예제를 따라하거나 만들어보고 싶은걸 시작해보면 되겠다

참고 사이트

www.itworld.co.kr/news/95019

docs.microsoft.com/ko-kr/windows/uwp/get-started/universal-application-platform-guide

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

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

UWP에서 이미지 불러오는걸 구현한 예제

이미지를 불러올 때는 기존과 다르게 버튼만으로 구현하게 아니라 플라이 아웃 메뉴라고

클릭 시 버튼들이 주르륵 목록화 되어 나오는걸로 구현해봄

조금 귀찮고 이거보다도 더 멋지게 할수있지만 그냥 간단하게 클릭했을 때 늘어나는 메뉴를 해보고싶어서 추가함

이미지 위에 불러온 이미지를 닫는 버튼이 있고 이 버튼 위에 마우스 호버링이 이루어지면 버튼의 색상을 투명화되게끔 추가함

using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives; //FlyoutBase
using Windows.UI.Xaml.Input; //UI 이동
using Windows.UI.Xaml.Media; 

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

namespace testing
{
    /// <summary>
    /// 자체적으로 사용하거나 프레임 내에서 탐색할 수 있는 빈 페이지입니다.
    /// </summary>
    public sealed partial class MainPage : Page
    {

        int Img_open_switch = 0;

        //앱바 메뉴
        int Bar_menu_switch = 0;

        public MainPage()
        {
            this.InitializeComponent();

        }
        
        private void Media_menu_Click(object sender, RoutedEventArgs e)
        {
            FlyoutBase.ShowAttachedFlyout((FrameworkElement)sender);
        }      

        //이미지 불러오기
        private async void IMG_open_Click(object sender, RoutedEventArgs e)
        {
            if (Img_open_switch == 0)
            {
                var picker = new Windows.Storage.Pickers.FileOpenPicker
                {
                    ViewMode = Windows.Storage.Pickers.PickerViewMode.Thumbnail,
                    SuggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.PicturesLibrary
                };

                picker.FileTypeFilter.Add(".jpg");
                picker.FileTypeFilter.Add(".jpeg");
                picker.FileTypeFilter.Add(".png");
                picker.FileTypeFilter.Add(".bmp");
                picker.FileTypeFilter.Add(".gif");

                Windows.Storage.StorageFile file = await picker.PickSingleFileAsync();
                if (file != null)
                {                 
                    if (!IMG_G.IsOpen) { IMG_G.IsOpen = true; }
                    // Application now has read/write access to the picked file
                    using (Windows.Storage.Streams.IRandomAccessStream fileStream = await file.OpenAsync(Windows.Storage.FileAccessMode.Read))
                    {
                        // Set the image source to the selected bitmap 
                        Windows.UI.Xaml.Media.Imaging.BitmapImage bitmapImage = new Windows.UI.Xaml.Media.Imaging.BitmapImage
                        {
                            DecodePixelWidth = 600 //리소스를 줄이기 위한 픽셀고정(최대 720)
                        };
                        await bitmapImage.SetSourceAsync(fileStream);
                        img.Source = bitmapImage;

                        IMG_C.Visibility = Visibility.Visible;
                    }
                }
                else
                {
                }

                Img_open_switch = 1;
            }

            //이미지 닫는 부분 추가
            else
            {
                img.Source = null;
                IMG_C.Visibility = Visibility.Collapsed;

                if (IMG_G.IsOpen) { IMG_G.IsOpen = false; }
                
                Img_open_switch = 0;
            }
        }

        //이미지 닫기
        async private void IMG_C_Click(object sender, RoutedEventArgs e)
        {            
            img.Source = null;
            IMG_C.Visibility = Visibility.Collapsed;

            Img_open_switch = 0;

            if (IMG_G.IsOpen) { IMG_G.IsOpen = false; }
        }

    }
}

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}">

    <Page.Resources>
        <DataTemplate x:Key="ImageTemplate">
            <Grid>
                <Image Source="{Binding}" />
            </Grid>
        </DataTemplate>


        <!--메뉴 이미지 flyout-->

        <MenuFlyout x:Key="media_flyout">
            <MenuFlyoutItem Text="이미지" Click="IMG_open_Click" />
        </MenuFlyout>        
    </Page.Resources>
    
    
    <Grid>
        <StackPanel Orientation="Horizontal" Canvas.ZIndex="100" VerticalAlignment="Bottom" HorizontalAlignment="Center" >
            <CommandBar x:Name="Menu_bar" VerticalAlignment="Bottom"  HorizontalAlignment="Center" Canvas.ZIndex="100">
                <AppBarButton FlyoutBase.AttachedFlyout="{StaticResource media_flyout}" Click="Media_menu_Click" ToolTipService.ToolTip="미디어 오픈" Icon="Attach" />    
            </CommandBar>            
        </StackPanel>

        <!--이미지 닫기-->
        <Popup x:Name="IMG_G"  ManipulationMode="All" Canvas.ZIndex="5" Width="auto" Height="auto"  >
            <Grid x:Name="Img_save" ManipulationDelta="Img_ManipulationDelta">
                    <Image Canvas.ZIndex="6" VerticalAlignment="Top" HorizontalAlignment="Left" x:Name="img" ManipulationMode="All" Stretch="UniformToFill" Height="auto" Width="auto" >
                        <Image.RenderTransform>
                            <ScaleTransform x:Name="ScaleTransform" ScaleX="1.0" ScaleY="1.0"/>
                        </Image.RenderTransform>
                    </Image>

                <StackPanel Canvas.ZIndex="7" VerticalAlignment="Top" HorizontalAlignment="Left" Orientation="Horizontal">
                    <Button x:Name="IMG_C" Canvas.ZIndex="8" Background="White"  VerticalAlignment="Top" HorizontalAlignment="Left" Click="IMG_C_Click"  Width="65"  Height="65" >
                        <SymbolIcon Symbol="Cancel"/>
                    </Button>
                </StackPanel>
            </Grid>                
            
        </Popup>
    </Grid>
</Page>

예시 사진