2014-10-18 46 views
1

我正在創建一個Windows通用應用程序(WinRT和WP8.1)。 我想要的是讓用戶在同一頁面的兩種不同佈局之間進行選擇。 以下是簡單表示。 我想找到最簡單,最懶惰的方法(我知道我可以創建兩個頁面,但必須有更好的方法。) 我已經創建了1頁(後面有500行C#代碼來處理控件交互)現在需要添加第二個佈局。這兩個佈局具有完全相同的功能,並且控件具有相同的名稱,它們的排列方式不同。背後有兩個相同代碼的XAML頁面

在Android中我可以這樣做:

if(IsLayout1Selected) 
    setContentView(R.layout.activity_d2p_layout1); 

else 
    setContentView(R.layout.activity_d2p_layout2); 

預先感謝您的幫助!

佈局1:

<Page x:Name="d2pPageLayout1" 
x:Class="_MyApp.D2P" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:_MyApp" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" Unloaded="PageUnloaded" Loaded="PageLoaded" 
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid x:Name="mainGrid"> 
     <Button x:Name="button1" VerticalAlignment="Top" Click="buttonClick"/> 
     <TextBlock x:Name="textblock1" Text="Hello"/> 
     <!-- Of course there are a lot more elements and they have many layout properties that differ --> 
    </Grid> 
</Page> 

佈局2:

<Page x:Name="d2pPageLayout2" 
x:Class="_MyApp.D2P" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:_MyApp" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" Unloaded="PageUnloaded" Loaded="PageLoaded" 
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
    <Grid x:Name="mainGrid"> 
     <Button x:Name="button1" VerticalAlignment="Bottom" Click="buttonClick"/> 
     <TextBlock x:Name="textblock1" Text="Hello"/> 
     <!-- Of course there are a lot more elements and they have many layout properties that differ --> 
    </Grid> 
</Page> 

代碼後面(對於相同佈局1和佈局2):

namespace _MyApp 
{ 
    public sealed partial class D2P : Page 
    { 
    public D2P() 
     { 
      this.InitializeComponent(); 
     } 

    private void PageLoaded(object sender, RoutedEventArgs e) 
     { 
      // do stuff here 
     } 

    private void PageUnloaded(object sender, RoutedEventArgs e) 
     { 
      // do some other stuff here 
     } 

    private void buttonClick(object sender, RoutedEventArgs e) 
     { 
      // handle buttonClick here 
      // a lot of this code also references the controls directly e.g. 
      textblock1.Text = "Button 1 was clicked"; 
     } 
    } 
} 

編輯:

感謝來自阿克沙伊SOAM尖端我就非常接近我想要的東西用的DataTemplate和ContentControl中,但現在這會導致另一個問題,打破我的代碼。我的代碼直接訪問很多元素。 例子:

textblock1.Text = "Button 1 was clicked"; 

因爲我的整個頁面的內容現在包裹的DataTemplate內無法訪問的元素了。我該怎麼做呢?

當前實現:

XAML:

<Page.Resources> 
    <DataTemplate x:Key="template1"> 
     <Button x:Name="button1" VerticalAlignment="Bottom" Click="buttonClick"/> 
     <TextBlock x:Name="textblock1" Text="Hello"/> 
    </DataTemplate> 
</Page.Resources> 
<ContentControl x:Name="contentControl" Content="{Binding}"/> 

後面的代碼:

contentControl.ContentTemplate = template1; 
this.DataContext = template1; 
+0

你可以使用一個內容控件和一個數據模板 – thumbmunkeys 2014-10-18 12:21:56

+0

@thumbmunkeys謝謝,這讓我有一半在那裏,我已經更新了問題與一個由此產生的問題。 – Johis 2014-10-18 19:00:08

回答

1

至於你的新的問題,您可以瀏覽的VisualTree並提取出來。

這裏是我的話題舊答案之一:VisualTree Helper


但是不要那樣做。您想要使用MVVM模式並將.Text綁定到ModelView的屬性,並將該Button綁定到該模型視圖的命令。通過這種方式,您可以更改屬性並通過INotifyPropertyChanged ---更改.Text屬性,它將自動更新帶有新更改的文本框。


一個非常容易閱讀的MVVM文章我寫了回答相關的SO問題。它也有Button Command。不幸的是,這不是WinForms,所以你必須遵守規則。

Implement a ViewModel Single Command with CommandParamater

+0

謝謝。將來,我將確定從MVVM模式開始。但是對於這個幾乎完成的應用程序,我依賴於依賴於傳遞給它的控件的許多函數(主要是動畫內容)。將所有內容轉移到MVVM將需要很長時間。我曾希望能以某種方式改變'this.InialializeComponent();'調用來基於另一個XAML頁面進行初始化,就像我可以在Android中使用'setContentView'一樣。我目前正試圖讓VisualTreeHelper工作。 – Johis 2014-10-20 23:20:45

0

你可以建立一個以上的XAML可以在同一頁喜歡這裏: 我建8 XAML針對不同的屏幕尺寸相同的MainPage

public sealed partial class MainPage : Page 
{ 


    public MainPage() 
    { 

     Rect bounds = ApplicationView.GetForCurrentView().VisibleBounds; 
     double scaleFactor = DisplayInformation.GetForCurrentView().RawPixelsPerViewPixel; 
     Size size = new Size(bounds.Width * scaleFactor, bounds.Height * scaleFactor); 



     string resourceName; 

     if (size.Width >= 1920 && size.Height >= 1080) resourceName = "ms-appx:///MainPage.layout-1920x1080.xaml"; 
     else if (size.Width >= 1680 && size.Height >= 1050) resourceName = "ms-appx:///MainPage.layout-1680x1050.xaml"; 
     else if (size.Width >= 1600 && size.Height >= 1200) resourceName = "ms-appx:///MainPage.layout-1600x1200.xaml"; 
     else if (size.Width >= 1360 && size.Height >= 768) resourceName = "ms-appx:///MainPage.layout-1360x768.xaml"; 
     else if (size.Width >= 1280 && size.Height >= 1024) resourceName = "ms-appx:///MainPage.layout-1280x1024.xaml"; 
     else if (size.Width >= 1024 && size.Height >= 768) resourceName = "ms-appx:///MainPage.layout-1024x768.xaml"; 
     else if (size.Width >= 720 && size.Height >= 480) resourceName = "ms-appx:///MainPage.layout-720x480.xaml"; 
     else resourceName = "ms-appx:///MainPage.layout-640x480.xaml"; 

     this.InitializeComponent(new Uri(resourceName, UriKind.Absolute)); 

    } 



} 

}

這些都是代碼的鏈接,您可以將其用於您的場景
https://developer.microsoft.com/en-us/windows/iot/samples/digitalsign

https://github.com/ms-iot/samples/tree/develop/DigitalSign

相關問題