반응형
일반적으로 올리는 UWP 소스는 C#, XAML 을 기준으로 합니다.
잘못된 부분이 있거나 궁금하신게 있으면 댓글 달아주세요
UWP 사용 시 입력한 인터넷 주소에 접속하여 기본적인 페이지의 기능을 모두 사용할수있고
주소창 입력이 가능하여 다른 페이지로의 이동이 가능한 기능인 웹뷰를 사용할수있는 예제
웹 뷰창을 닫을 수 있고 입력한 주소로 이동이 가능하게 버튼을 추가해봄
자세한 사항은 아래 첨부된 코드를 확인해주세여
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 Web_View_switch = 0;
public MainPage()
{
this.InitializeComponent();
}
// 웹뷰 인터넷 사용 클릭 = 브라우저 팝업 창 뜸
async private void Web_view_Click(object sender, RoutedEventArgs e)
{
if (Web_View_switch == 0)
{
Web_View_switch = 1;
Web_view.Visibility = Visibility.Visible;
}
//웹뷰 닫기
else
{
Web_view.Visibility = Visibility.Collapsed;
//tbxURL.Text = "";
String sURL = "http://www.naver.com/";
Uri webURL = new Uri(sURL);
ctlBrowser.Navigate(webURL);
Web_View_switch = 0;
}
}
// 웹뷰 주소창 이동
private void Web_Start_Click(object sender, RoutedEventArgs e)
{
String sURL = tbxURL.Text;
if (sURL.IndexOf("http://") == -1) { sURL = "http://" + sURL; }
try
{
Uri webURL = new Uri(sURL);
ctlBrowser.Navigate(webURL);
}
catch (Exception)
{
// throw;
}
}
// 웹뷰 주소창
private void CtlBrowser_NavigationStarting(WebView sender, WebViewNavigationStartingEventArgs args)
{
ctlProgress.IsActive = true;
}
private void CtlBrowser_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
{
ctlProgress.IsActive = false;
}
//웹뷰 인터넷 닫기
private void Web_C_Click(object sender, RoutedEventArgs e)
{
Web_view.Visibility = Visibility.Collapsed;
//tbxURL.Text = "";
String sURL = "http://www.naver.com/";
Uri webURL = new Uri(sURL);
ctlBrowser.Navigate(webURL);
Web_View_switch = 0;
}
}
}
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="webView" Click="Web_view_Click">웹뷰 열기</Button>
<TextBlock Width="1" Height="1" VerticalAlignment="Top" HorizontalAlignment="Right" x:Name="textBlock" ></TextBlock>
<!--웹뷰-->
<StackPanel x:Name="Web_view" Canvas.ZIndex="6">
<StackPanel x:Name="Web_menu" Height="50" Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Gainsboro" >
<!--<Grid x:Name="Web_menu">-->
<Image Source="Assets/5url.png" Width="60" Height="50" Stretch="Uniform" />
<TextBox x:Name="tbxURL" Text="http://" Width="500" Background="White" BorderBrush="#8d8d8d" BorderThickness="1" Padding="5" ToolTipService.ToolTip="URL 작성" />
<Button x:Name="Web_Start" ToolTipService.ToolTip="입력 URL로 이동" Height="auto" Click="Web_Start_Click">
<SymbolIcon Symbol="Forward"/>
</Button>
<Button x:Name="Web_C" Click="Web_C_Click" ToolTipService.ToolTip="웹 종료">
<SymbolIcon Symbol="Cancel"/>
</Button>
<ProgressRing x:Name="ctlProgress" Height="30" Width="30" />
<!--</Grid>-->
</StackPanel>
<WebView x:Name="ctlBrowser" NavigationStarting="CtlBrowser_NavigationStarting" NavigationCompleted="CtlBrowser_NavigationCompleted" Source="http://www.naver.com/" Height="1026" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</StackPanel>
</Grid>
</Page>
XAML 에는 버튼에 아이콘을 삽입해보았다
생각보다 간단하게 UWP 기본 제공 심플 아이콘을 입힐수 있으니 모두들 사용해보자
아래는 사용 예제 이미지 첨부
-> 클릭 시 입력한 주소로 웹페이지 이동
X 클릭 시 웹뷰 화면 닫기 가능
웹뷰 닫은 뒤 열기 클릭 시 웹뷰 화면 다시 불러와짐
반응형
'UWP' 카테고리의 다른 글
| [UWP] 웹 카메라 화면 불러오기 및 UI 이동, 크기조절 하기 (0) | 2020.12.18 |
|---|---|
| [UWP] 유니버셜 Windows 플랫폼 프로젝트 시작하기 (0) | 2020.12.09 |
| [UWP] 내 PC에서 로컬 이미지 가져오는법 (0) | 2020.12.08 |
| [UWP] 로컬에서 불러온 동영상 이동, 크기 조절하기 (0) | 2020.11.17 |
| [UWP] 미디어 플레이어 사용해서 로컬 동영상 파일 불러오기 (0) | 2020.11.16 |
