Sviluppo di Windows 10 - Codice adattivo

In questo capitolo, dimostreremo l'adozione della tua applicazione su diversi dispositivi supportati da Windows 10. Abbiamo già imparato ad adottare la tua interfaccia utente e tutti i trucchi, le tecniche ei controlli utilizzati nelle applicazioni UWP.

Ora impareremo come adottare il tuo codice, perché

I codici delle applicazioni non sono gli stessi su tutti i dispositivi.
Le API utilizzate, in particolare per Xbox, non saranno disponibili per i dispositivi mobili. La stessa cosa vale per HoloLens ecc.

Adaptive il codice può illuminare la tua applicazione in modo condizionale ed eseguire codice solo quando è in esecuzione su una specifica famiglia di dispositivi e / o su una particolare versione della piattaforma / estensione API.

Codice di scrittura

In Windows 10 puoi implementare le applicazioni UWP in Visual Studio usando C ++, C #, Visual Basic o JavaScript.

Con C # e Visual Basic puoi usare XAML per la progettazione dell'interfaccia utente.
Con C ++ puoi usare DirectX invece di usare XAML.
Per JavaScript, puoi utilizzare HTML per il tuo livello di presentazione, che è uno standard Web multipiattaforma.

Le API di Windows Core vengono eseguite allo stesso modo per tutti i dispositivi, che contengono la maggior parte delle funzionalità necessarie per il codice e l'interfaccia utente. Tuttavia, per il codice e l'interfaccia utente personalizzati per particolari famiglie di dispositivi, è necessario usare il codice adattivo e l'interfaccia utente adattiva.

Calling an API that is NOT implemented by the target device family −

L'interfaccia utente si adatta facilmente a schermi diversi, ma diverse famiglie di dispositivi non solo hanno schermi di dimensioni diverse, ma hanno molto di più.

Ad esempio, i telefoni cellulari hanno alcuni pulsanti hardware come Indietro e Fotocamera, che potrebbero non essere disponibili su altri dispositivi come il PC.
Per impostazione predefinita, le API di base contengono la maggior parte delle funzionalità, che funzionano per tutti i dispositivi, ma la funzionalità specifica del dispositivo può essere usata facendo riferimento agli SDK di estensione nelle applicazioni UWP proprio come gli assembly esterni.

Per aggiungere un particolare SDK di estensione, necessario nella tua applicazione, segui i passaggi indicati di seguito:

Fare clic con il pulsante destro del mouse sul file References.
Selezionare “Add References..”. Si aprirà la seguente finestra di dialogo.

Aggiungere un'estensione è semplice come aggiungere un riferimento al progetto.
Ora puoi aggiungere qualsiasi SDK di estensione dall'elenco, che contiene estensione desktop, estensione IoT e estensione mobile ecc.

Le estensioni desktop e mobile sono i due SDK di estensione della piattaforma più comuni. L'estensione Mobile, ad esempio, abilita le API necessarie per utilizzare il pulsante della fotocamera hardware.

È possibile verificare le funzionalità del dispositivo utilizzando il Windows.Foundation.Metadata.ApiInformationclass, che restituisce un output booleano se il tipo è supportato nel dispositivo corrente. Ad esempio, puoi abilitare la tua app Windows per utilizzare il pulsante Fotocamera con un codice come questo:

bool isHardwareButtonsAPIPresent = 
   Windows.Foundation.Metadata.ApiInformation.
   IsTypePresent("Windows.Phone.UI.Inpu t.HardwareButtons");  
		
if (isHardwareButtonsAPIPresent) { 
   Windows.Phone.UI.Input.HardwareButtons.CameraPressed += HardwareButtons_CameraPressed; 
}

Il codice del pulsante della fotocamera del telefono verrà eseguito solo se Mobile Extension SDK è abilitato sul dispositivo. Allo stesso modo, puoi anche controllare qualsiasi evento, metodo o proprietà particolare nella versione API corrente utilizzandoIsEventPresent, IsMethodPresent, IsPropertyPresent, invece di IsTypePresent come mostrato di seguito.

bool isHardwareButtons_CameraPressedAPIPresent = 
   Windows.Foundation.Metadata.ApiInformation.IsEventPresent 
   ("Windows.Phone.UI.Input.HardwareButtons", "CameraPressed");

API Win32 nella piattaforma UWP

Un'applicazione UWP (Universal Widows Platform) o un componente Windows Runtime, scritti in C ++ / CX, possono accedere alle API Win32, che ora fanno anche parte di UWP. Tutte le famiglie di dispositivi Windows 10 possono implementare API Win32 collegando la tua applicazione conWindowsapp.lib.

Windowsapp.libè una libreria "ombrello" che fornisce le esportazioni per le API UWP. Collegamento aWindowsapp.lib aggiungerà alla tua app dipendenze da dlls presenti su tutte le famiglie di dispositivi Windows 10.

Diamo uno sguardo a un semplice esempio in cui l'applicazione si rivolge sia al desktop che al telefono. Pertanto, quando l'applicazione viene eseguita sul desktop, non mostrerà la barra di stato, ma quando la stessa applicazione viene eseguita sul telefono, visualizzerà la barra di stato.

Di seguito è riportato il codice XAML in cui vengono aggiunti diversi controlli.

<Page 
   x:Class = "UWPAdoptiveCode.MainPage" 
   xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
   xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:local = "using:UWPAdoptiveCode" 
   xmlns:d = "http://schemas.microsoft.com/expression/blend/2008"
   xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" 
   mc:Ignorable = "d">  

   <Page.Background> 
      <SolidColorBrush Color = "Green"/> 
   </Page.Background>
	
   <Page.BottomAppBar> 
      <CommandBar x:Name = "commandBar" > 
         <AppBarButton Icon = "Accept" Label = "appbarbutton"/> 
         <AppBarButton Icon = "Cancel" Label = "appbarbutton"/> 
      </CommandBar> 
   </Page.BottomAppBar>
	
   <Grid Background = "AliceBlue"> 
	
      <VisualStateManager.VisualStateGroups> 
		
         <VisualStateGroup> 
			
            <VisualState> 
               <VisualState.StateTriggers> 
                  <local:DeviceFamilyTrigger DeviceFamily = "Desktop" /> 
               </VisualState.StateTriggers> 
					
               <VisualState.Setters> 
                  <Setter Target = "StatusBarControls.Visibility" 
                     Value = "Collapsed"/> 
               </VisualState.Setters>  
					
            </VisualState> 
				
         </VisualStateGroup> 
			
      </VisualStateManager.VisualStateGroups> 
		
      <StackPanel HorizontalAlignment = "Left" Margin = "75,164,0,0"
         VerticalAlignment = "Top" > 
			
         <RadioButton x:Name = "ShowAppBarRadioButton" Content = "Show AppBar"
            HorizontalAlignment = "Stretch" VerticalAlignment = "Stretch"
            IsChecked = "True" Checked = "RadioButton_Checked"/>
				
         <RadioButton x:Name = "ShowOpaqueAppBarRadioButton" 
            Content = "Show Transparent AppBar" HorizontalAlignment = "Stretch"
            VerticalAlignment = "Stretch" Checked = "RadioButton_Checked"/> 
				
         <RadioButton x:Name = "HideAppBarRadioButton" Content = "Hide AppBar"
            HorizontalAlignment = "Stretch" VerticalAlignment = "Stretch" 
            Checked = "RadioButton_Checked"/>
				
      </StackPanel> 
		
      <StackPanel x:Name = "StatusBarControls" Orientation = "Vertical" 
         Margin = "75,350,0,0" Visibility = "Visible">
			
         <CheckBox x:Name = "StatusBarBackgroundCheckBox" 
            Content = "Set StatusBar Background"
            Checked = "StatusBarBackgroundCheckBox_Checked" 
            Unchecked = "StatusBarBackgroundCheckBox_Unchecked"/>
				
         <CheckBox x:Name = "StatusBarHiddenCheckBox" 
            Content = "Set StatusBar Hidden" Checked = "StatusBarHiddenCheckBox_Checked"
            Unchecked = "StatusBarHiddenCheckBox_Unchecked"/> 
				
      </StackPanel> 
		
   </Grid> 
	
</Page>

Di seguito è riportata l'implementazione C # per diversi eventi.

using Windows.UI; 
using Windows.UI.Xaml; 
using Windows.UI.Xaml.Controls;  

// The Blank Page item template is documented at
   http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409  

namespace UWPAdoptiveCode { 
   /// <summary> 
      /// An empty page that can be used on its own or navigated to within a Frame. 
   /// </summary> 
	
   public sealed partial class MainPage : Page { 
     
      private Color? DefaultTitleBarButtonsBGColor; 
      private Color? DefaultTitleBarBGColor;
		
      public MainPage() {
         this.InitializeComponent();
			
         //Windows.UI.ViewManagement.ApplicationView.GetForCurrentView().
            VisibleBoundsCh anged += MainPage_VisibleBoundsChanged;
				
         var viewTitleBar = Windows.UI.ViewManagement.ApplicationView.
            GetForCurrentView().TitleBar; 
				
         DefaultTitleBarBGColor = viewTitleBar.BackgroundColor; 
         DefaultTitleBarButtonsBGColor = viewTitleBar.ButtonBackgroundColor; 
      } 
		
      private void RadioButton_Checked(object sender, RoutedEventArgs e) {
        
         // Bottom AppBar shows on Desktop and Mobile 
         if (ShowAppBarRadioButton != null) {
			  
            if (ShowAppBarRadioButton.IsChecked.HasValue &&
               (ShowAppBarRadioButton.IsChecked.Value == true)) {
                 commandBar.Visibility = Windows.UI.Xaml.Visibility.Visible; 
                 commandBar.Opacity = 1; 
            } else {
               commandBar.Visibility = Windows.UI.Xaml.Visibility.Collapsed; 
            } 
         } 
			
         if (ShowOpaqueAppBarRadioButton != null) {
             
            if (ShowOpaqueAppBarRadioButton.IsChecked.HasValue &&
               (ShowOpaqueAppBarRadioButton.IsChecked.Value == true)){ 
                  commandBar.Visibility = Windows.UI.Xaml.Visibility.Visible; 
                  commandBar.Background.Opacity = 0; 
            } else{ 
               commandBar.Background.Opacity = 1; 
            } 
         } 
			
      } 
		
      private void StatusBarHiddenCheckBox_Checked(object sender, RoutedEventArgs e){
        
         // StatusBar is Mobile only 
         if (Windows.Foundation.Metadata.ApiInformation.
            IsTypePresent("Windows.UI.ViewManag ement.StatusBar")){ 
               var ignore = Windows.UI.ViewManagement.StatusBar.GetForCurrentView().HideAsync(); 
         } 
      } 
		
      private void StatusBarHiddenCheckBox_Unchecked(object sender, RoutedEventArgs e){
	  
         // StatusBar is Mobile only 
         if (Windows.Foundation.Metadata.ApiInformation.
            IsTypePresent("Windows.UI.ViewManag ement.StatusBar")){
               var ignore = Windows.UI.ViewManagement.StatusBar.GetForCurrentView().ShowAsync(); 
         } 
      }  
		
      private void StatusBarBackgroundCheckBox_Checked(object sender, RoutedEventArgs e){
       
         // StatusBar is Mobile only 
         if (Windows.Foundation.Metadata.ApiInformation.
            IsTypePresent("Windows.UI.ViewManag ement.StatusBar")){ 
				
               Windows.UI.ViewManagement.StatusBar.GetForCurrentView().
                  BackgroundColor = Windows.UI.Colors.Blue; 
					
               Windows.UI.ViewManagement.StatusBar.GetForCurrentView().
                   BackgroundOpacity = 1; 
         } 
      }  
		
      private void StatusBarBackgroundCheckBox_Unchecked(object sender, RoutedEventArgs e){
         
         // StatusBar is Mobile only 
         if (Windows.Foundation.Metadata.ApiInformation.
            IsTypePresent("Windows.UI.ViewManag ement.StatusBar")){
               Windows.UI.ViewManagement.StatusBar.GetForCurrentView().
                  BackgroundOpacity = 0; 
         } 
      } 
		
   } 
	
   public class DeviceFamilyTrigger : StateTriggerBase{
    
      //private variables 
      private string _deviceFamily;
	  
      //Public property 
      public string DeviceFamily {
         
         get {
            return _deviceFamily; 
         } 
         set{
            _deviceFamily = value; 
            var qualifiers = Windows.ApplicationModel.Resources.Core.ResourceContext.
               GetForCurrentView().Qua lifierValues; 
					
            if (qualifiers.ContainsKey("DeviceFamily")) 
               SetActive(qualifiers["DeviceFamily"] == _deviceFamily); 
            else 
               SetActive(false); 
         } 
      } 
   } 
}

Quando il codice sopra indicato viene compilato ed eseguito su un dispositivo mobile, vedrai la seguente finestra.

È possibile modificare il colore di sfondo della barra di stato con la casella di controllo come mostrato nell'immagine.

Puoi anche nascondere la barra di stato.

Ora, quando esegui la stessa applicazione su un dispositivo desktop, vedrai la seguente finestra in cui la barra di stato e le caselle di controllo specifiche della barra di stato non sono visibili.

↰ Previous page Next page ↱

Sviluppo di Windows 10 - Codice adattivo

Codice di scrittura

API Win32 nella piattaforma UWP

Tutorial sullo sviluppo di Windows 10