반응형

일반적으로 올리는 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 클릭 시 웹뷰 화면 닫기 가능

웹뷰 닫은 뒤 열기 클릭 시 웹뷰 화면 다시 불러와짐

 

반응형

+ Recent posts