Search code examples
xamluwpwindows-10-iot-corenavigationviewwinui

UWP C# WINUI NavigationView How to access other pages/views


I am writing an app using navigation view basing on Using the NavigationView in your UWP applications tutorial. I hope someone can help to clarify 2 things

  1. what is the best practice to place my general routines? in the MainPage.xaml.cs or the xaml in respective views?

  2. How do i update my xaml element such as textblock in a different view? eg. I have a readHardwareID routine run at startup to read the hardware ID in MainPage.xaml.cs How do I display the information in InfoPage.xaml.

my UI Main enter image description here

Please advise, Thanks.

Updated: 06-08-2020

I am trying to pass a simple AppVerison text from MainPage to InfoPage to test out OnNavigateTo. However when I run the code and clicked on the info tab, I ran into this error. enter image description here

MainPage Code

public String AppVersionName = "Test version 1.0";

private void nvTopLevelNav_ItemInvoked(NavigationView sender, NavigationViewItemInvokedEventArgs args)
    {
        if (args.IsSettingsInvoked)
        { 
            contentFrame.Navigate(typeof(SettingsPage));    
        } else    
        {
            TextBlock ItemContent = args.InvokedItem as TextBlock;
            if (ItemContent != null)
            {
                switch (ItemContent.Tag)
                {
                    case "Nav_Home":
                        contentFrame.Navigate(typeof(HomePage));
                        break;

                    case "Nav_Devices":
                        contentFrame.Navigate(typeof(DevicesPage));
                        break;

                    case "Nav_Log":
                        contentFrame.Navigate(typeof(LogPage));
                        break;

                    case "Nav_Info":
                        contentFrame.Navigate(typeof(InfoPage));
                        break;
                }
            }
        }

InfoPage Code

public sealed partial class InfoPage : Page
{
    private MainPage mainPage;

    string appVersion; 

    public InfoPage(MainPage page)
    {
        this.InitializeComponent();
        mainPage = page;
    }

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);

        var data = e.Parameter;
        appVersion = mainPage.AppVersionName; 

        readHardwareID();
    }

    public void readHardwareID()
    {
        var deviceIdtoken = HardwareIdentification.GetPackageSpecificToken(null);
        var deviceId = deviceIdtoken.Id;
        var deviceIdReader = DataReader.FromBuffer(deviceId);

        byte[] deviceIdbytes = new byte[deviceId.Length];
        deviceIdReader.ReadBytes(deviceIdbytes);

        DeviceID.Text = BitConverter.ToString(deviceIdbytes);

        var sysIdToken = SystemIdentification.GetSystemIdForPublisher();
        var sysId = sysIdToken.Id;
        var sysIdReader = DataReader.FromBuffer(sysId);

        byte[] sysIdbytes = new byte[sysId.Length];
        sysIdReader.ReadBytes(sysIdbytes);

        SystemID.Text = BitConverter.ToString(sysIdbytes);

        // get the system family information
        string deviceFamily = AnalyticsInfo.VersionInfo.DeviceFamily;
        Device.Text = deviceFamily;

        // get the system version number
        var deviceFamilyVersion = AnalyticsInfo.VersionInfo.DeviceFamilyVersion.ToString();
        var version = ulong.Parse(deviceFamilyVersion);
        var majorVersion = (version & 0xFFFF000000000000L) >> 48;
        var minorVersion = (version & 0x0000FFFF00000000L) >> 32;
        var buildVersion = (version & 0x00000000FFFF0000L) >> 16;
        var revisionVersion = (version & 0x000000000000FFFFL);
        var systemVersion = $"{majorVersion}.{minorVersion}.{buildVersion}.{revisionVersion}";
        OSVersion.Text = systemVersion.ToString();
        AppVersion.Text = appVersion;

    }
}

Solution

  • what is the best practice to place my general routines? in the MainPage.xaml.cs or the xaml in respective views?

    If you want to use NavigationView as the app's base architecture, we suggest you use Windows Template Studio to make NavigationView UWP template app. You could add the specific the page with Windows Template Studio. For more please refer link here.

    How do i update my xaml element such as textblock in a different view? eg. I have a readHardwareID routine run at startup to read the hardware ID in MainPage.xaml.cs How do I display the information in InfoPage.xaml

    If you have load the data in the MainPage, you could use Frame.Navigate method to page the parameter when navigate to InfoPage and getting the data from OnNavigatedTo override method.

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);
    
        var data = e.Parameter;
    }