{"id":18947,"date":"2024-03-15T17:53:35","date_gmt":"2024-03-15T17:53:35","guid":{"rendered":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/"},"modified":"2024-03-21T14:31:40","modified_gmt":"2024-03-21T14:31:40","slug":"how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf","status":"publish","type":"post","link":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/","title":{"rendered":"How to achieve switching between multiple xaml interfaces in WPF?"},"content":{"rendered":"

In WPF, multiple XAML interfaces can be switched through the following methods:<\/p>\n

    \n
  1. Using the Frame control: Within the XAML of the main window, add a Frame control and use it as the content container of the main window. Then, the Navigate method of the Frame can be used to switch between different XAML interfaces. For example, when a button is clicked, the Navigate method can be used to navigate to another XAML interface.<\/li>\n<\/ol>\n
    <Window>\r\n    <Grid>\r\n        <Frame x:Name=\"ContentFrame\" \/>\r\n    <\/Grid>\r\n<\/Window>\r\n<\/code><\/pre>\n
    private<\/span> void<\/span> Button_Click<\/span>(object<\/span> sender, RoutedEventArgs e<\/span>)<\/span>\r\n{\r\n    ContentFrame.Navigate(new<\/span> Uri(\"Page1.xaml\"<\/span>, UriKind.Relative));\r\n}\r\n<\/code><\/pre>\n
      \n
    1. Utilize the UserControl control: by creating multiple UserControls to represent different XAML interfaces, then in the main window’s XAML, use ContentControl as needed to display different UserControls. Switching interfaces can be achieved by setting the Content property.<\/li>\n<\/ol>\n
      <Window>\r\n    <Grid>\r\n        <ContentControl x:Name=\"Content\" \/>\r\n    <\/Grid>\r\n<\/Window>\r\n<\/code><\/pre>\n
      private<\/span> void<\/span> Button_Click<\/span>(object<\/span> sender, RoutedEventArgs e<\/span>)<\/span>\r\n{\r\n    Content.Content = new<\/span> Page1();\r\n}\r\n<\/code><\/pre>\n
        \n
      1. By using custom container controls, you can create a personalized container control that inherits from Panel or ContentControl and implement your own interface switching logic. For example, you can create a custom TabControl where each TabItem corresponds to a XAML interface, allowing you to switch between interfaces by selecting different TabItems.<\/li>\n<\/ol>\n
        There are several common ways to implement switching between multiple XAML interfaces, choose the appropriate way based on specific needs and project architecture.<\/p>\n","protected":false},"excerpt":{"rendered":"
        In WPF, multiple XAML interfaces can be switched through the following methods: Using the Frame control: Within the XAML of the main window, add a Frame control and use it as the content container of the main window. Then, the Navigate method of the Frame can be used to switch between different XAML interfaces. For […]<\/p>\n","protected":false},"author":9,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_import_markdown_pro_load_document_selector":0,"_import_markdown_pro_submit_text_textarea":"","footnotes":""},"categories":[1],"tags":[],"class_list":["post-18947","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"yoast_head":"\nHow to achieve switching between multiple xaml interfaces in WPF? - Blog - Silicon Cloud<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to achieve switching between multiple xaml interfaces in WPF?\" \/>\n<meta property=\"og:description\" content=\"In WPF, multiple XAML interfaces can be switched through the following methods: Using the Frame control: Within the XAML of the main window, add a Frame control and use it as the content container of the main window. Then, the Navigate method of the Frame can be used to switch between different XAML interfaces. For […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog - Silicon Cloud\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/SiliCloudGlobal\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-15T17:53:35+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-21T14:31:40+00:00\" \/>\n<meta name=\"author\" content=\"Ava Mitchell\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@SiliCloudGlobal\" \/>\n<meta name=\"twitter:site\" content=\"@SiliCloudGlobal\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ava Mitchell\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\"},\"author\":{\"name\":\"Ava Mitchell\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/a3e2658c2cb9fb2be95ae0a8861f4a64\"},\"headline\":\"How to achieve switching between multiple xaml interfaces in WPF?\",\"datePublished\":\"2024-03-15T17:53:35+00:00\",\"dateModified\":\"2024-03-21T14:31:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\"},\"wordCount\":195,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#organization\"},\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\",\"url\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\",\"name\":\"How to achieve switching between multiple xaml interfaces in WPF? - Blog - Silicon Cloud\",\"isPartOf\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#website\"},\"datePublished\":\"2024-03-15T17:53:35+00:00\",\"dateModified\":\"2024-03-21T14:31:40+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.silicloud.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to achieve switching between multiple xaml interfaces in WPF?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#website\",\"url\":\"https:\/\/www.silicloud.com\/blog\/\",\"name\":\"Silicon Cloud Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#organization\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#organization\",\"name\":\"Silicon Cloud Blog\",\"url\":\"https:\/\/www.silicloud.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png\",\"contentUrl\":\"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png\",\"width\":1024,\"height\":1024,\"caption\":\"Silicon Cloud Blog\"},\"image\":{\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/SiliCloudGlobal\/\",\"https:\/\/twitter.com\/SiliCloudGlobal\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/a3e2658c2cb9fb2be95ae0a8861f4a64\",\"name\":\"Ava Mitchell\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/15c63cd0564b4a2e07d611bcdffa296f6ea80e8db07c3091f43a84010514899d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/15c63cd0564b4a2e07d611bcdffa296f6ea80e8db07c3091f43a84010514899d?s=96&d=mm&r=g\",\"caption\":\"Ava Mitchell\"},\"url\":\"https:\/\/www.silicloud.com\/blog\/author\/avamitchell\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to achieve switching between multiple xaml interfaces in WPF? - Blog - Silicon Cloud","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/","og_locale":"en_US","og_type":"article","og_title":"How to achieve switching between multiple xaml interfaces in WPF?","og_description":"In WPF, multiple XAML interfaces can be switched through the following methods: Using the Frame control: Within the XAML of the main window, add a Frame control and use it as the content container of the main window. Then, the Navigate method of the Frame can be used to switch between different XAML interfaces. For […]","og_url":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/","og_site_name":"Blog - Silicon Cloud","article_publisher":"https:\/\/www.facebook.com\/SiliCloudGlobal\/","article_published_time":"2024-03-15T17:53:35+00:00","article_modified_time":"2024-03-21T14:31:40+00:00","author":"Ava Mitchell","twitter_card":"summary_large_image","twitter_creator":"@SiliCloudGlobal","twitter_site":"@SiliCloudGlobal","twitter_misc":{"Written by":"Ava Mitchell","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/#article","isPartOf":{"@id":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/"},"author":{"name":"Ava Mitchell","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/a3e2658c2cb9fb2be95ae0a8861f4a64"},"headline":"How to achieve switching between multiple xaml interfaces in WPF?","datePublished":"2024-03-15T17:53:35+00:00","dateModified":"2024-03-21T14:31:40+00:00","mainEntityOfPage":{"@id":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/"},"wordCount":195,"commentCount":0,"publisher":{"@id":"https:\/\/www.silicloud.com\/blog\/#organization"},"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/","url":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/","name":"How to achieve switching between multiple xaml interfaces in WPF? - Blog - Silicon Cloud","isPartOf":{"@id":"https:\/\/www.silicloud.com\/blog\/#website"},"datePublished":"2024-03-15T17:53:35+00:00","dateModified":"2024-03-21T14:31:40+00:00","breadcrumb":{"@id":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.silicloud.com\/blog\/how-to-achieve-switching-between-multiple-xaml-interfaces-in-wpf\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.silicloud.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to achieve switching between multiple xaml interfaces in WPF?"}]},{"@type":"WebSite","@id":"https:\/\/www.silicloud.com\/blog\/#website","url":"https:\/\/www.silicloud.com\/blog\/","name":"Silicon Cloud Blog","description":"","publisher":{"@id":"https:\/\/www.silicloud.com\/blog\/#organization"},"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.silicloud.com\/blog\/#organization","name":"Silicon Cloud Blog","url":"https:\/\/www.silicloud.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png","contentUrl":"https:\/\/www.silicloud.com\/blog\/wp-content\/uploads\/2023\/11\/EN-SILICON-Full.png","width":1024,"height":1024,"caption":"Silicon Cloud Blog"},"image":{"@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/SiliCloudGlobal\/","https:\/\/twitter.com\/SiliCloudGlobal"]},{"@type":"Person","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/a3e2658c2cb9fb2be95ae0a8861f4a64","name":"Ava Mitchell","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.silicloud.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/15c63cd0564b4a2e07d611bcdffa296f6ea80e8db07c3091f43a84010514899d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/15c63cd0564b4a2e07d611bcdffa296f6ea80e8db07c3091f43a84010514899d?s=96&d=mm&r=g","caption":"Ava Mitchell"},"url":"https:\/\/www.silicloud.com\/blog\/author\/avamitchell\/"}]}},"_links":{"self":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts\/18947","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/comments?post=18947"}],"version-history":[{"count":1,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts\/18947\/revisions"}],"predecessor-version":[{"id":52661,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/posts\/18947\/revisions\/52661"}],"wp:attachment":[{"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/media?parent=18947"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/categories?post=18947"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.silicloud.com\/blog\/wp-json\/wp\/v2\/tags?post=18947"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}