Implementación del modelo de ML.NET en una aplicación de Windows con las API de Windows Machine Learning

En la parte anterior de este tutorial, ha aprendido a compilar y exportar un modelo de ML.NET en formato ONNX. Ahora que tiene ese modelo, puede insertarlo en una aplicación de Windows y ejecutarlo localmente en un dispositivo mediante una llamada a las API de WinML.

Una vez que hayamos terminado, tendrás una aplicación WinML UWP de clasificador de imágenes funcional (C#).

Acerca de la aplicación de ejemplo

Con nuestro modelo, crearemos una aplicación que pueda clasificar imágenes de alimentos. Permite seleccionar una imagen del dispositivo local y procesarla mediante un modelo ONNX de clasificación almacenado localmente que ha creado y entrenado en la parte anterior. Las etiquetas devueltas se muestran junto a la imagen, así como la probabilidad de confianza de la clasificación.

Si ha seguido este tutorial hasta ahora, ya debería tener los requisitos previos necesarios para el desarrollo de aplicaciones. Si necesita un actualizador, consulte la primera parte de este tutorial.

Nota:

Si prefiere descargar el código de ejemplo completo, puede clonar el archivo de solución. Clone el repositorio, vaya a este ejemplo y abra el classifierMLNETModel.sln archivo con Visual Studio. Más tarde, puede ir directamente al paso [Iniciar la aplicación](#Iniciar la aplicación).

Crear una aplicación UWP WinML (C#)

A continuación, le mostraremos cómo crear la aplicación y el código WinML desde cero. Aprenderá a:

Cargue un modelo de Machine Learning.
Cargue una imagen en el formato necesario.
Enlace las entradas y salidas del modelo.
Evalúe el modelo y muestre resultados significativos.

También usarás XAML básico para crear una GUI sencilla, por lo que puedes probar el clasificador de imágenes.

Creación de la aplicación

Abra Visual Studio y elija create a new project.

Creación de un nuevo proyecto de Visual Studio

En la barra de búsqueda, escriba UWP y seleccione Blank APP (Universal Windows). Se abre un nuevo proyecto de C# para una aplicación de la Plataforma universal de Windows (UWP) de página única que no tiene controles predefinidos ni diseño. Seleccione Next para abrir una ventana de configuración para el proyecto.

Creación de una aplicación para UWP

En la ventana de configuración:

Elija un nombre para el proyecto. Aquí, usamos classifierMLNETModel.
Elija la ubicación del proyecto.
Si usa VS 2019, asegúrese de que Place solution and project in the same directory no está activado.
Si usa VS 2017, asegúrese de que Create directory for solution está activado.

Configuración de la aplicación

Presione create para crear el proyecto. Puede que se abra la ventana de versión mínima de destino. Asegúrese de que la versión mínima esté establecida en Windows 10 compilación 17763 o posterior.

Para crear una aplicación e implementar un modelo con una aplicación WinML, necesitará lo siguiente:

Una vez creado el proyecto, vaya a la carpeta del proyecto, abra la carpeta de assets [...\classifierMLNETModel\Assets] y copie el archivo bestModel.onnx en esta ubicación.

Exploración de la solución de proyecto

Vamos a explorar la solución del proyecto.

Visual Studio creó automáticamente varios archivos de código cs dentro del Explorador de soluciones. MainPage.xaml contiene el código XAML de la GUI y MainPage.xaml.cs contiene el código de la aplicación. Si has creado una aplicación para UWP antes, estos archivos deberían estar muy familiarizados contigo.

Creación de la GUI de aplicación

En primer lugar, vamos a crear una GUI sencilla para la aplicación.

Haga doble clic en el MainPage.xaml archivo. En la aplicación en blanco, la plantilla XAML de la GUI de la aplicación está vacía, por lo que tendremos que agregar algunas características de la interfaz de usuario.
Reemplace el código de MainPage.xaml por lo siguiente.

<Page
    x:Class="classifierMLNETModel.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:classifierMLNETModel"
    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 Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

	
        <StackPanel Margin="1,0,-1,0">
            <TextBlock x:Name="Menu" 
                       FontWeight="Bold" 
                       TextWrapping="Wrap"
                       Margin="10,0,0,0"
                       Text="Image Classification"/>
            <TextBlock Name="space" />
            <Button Name="recognizeButton"
                    Content="Pick Image"
                    Click="OpenFileButton_Click" 
                    Width="110"
                    Height="40"
                    IsEnabled="True" 
                    HorizontalAlignment="Left"/>
            <TextBlock Name="space3" />
            <Button Name="Output"
                    Content="Result is:"
                    Width="110"
                    Height="40"
                    IsEnabled="True" 
                    HorizontalAlignment="Left" 
                    VerticalAlignment="Top">
            </Button>
            <!--Dispaly the Result-->
            <TextBlock Name="displayOutput" 
                       FontWeight="Bold" 
                       TextWrapping="Wrap"
                       Margin="25,0,0,0"
                       Text="" Width="1471" />
            <TextBlock Name="space2" />
            <!--Image preview -->
            <Image Name="UIPreviewImage" Stretch="Uniform" MaxWidth="300" MaxHeight="300"/>
        </StackPanel>
    </Grid> 
</Page>

Adición del modelo al proyecto mediante el generador de código de Windows Machine Learning

Windows Machine Learning Code Generator o mlgen es una extensión de Visual Studio para ayudarle a empezar a usar las API de WinML en aplicaciones para UWP. Genera código de plantilla al agregar un archivo ONNX entrenado al proyecto de UWP.

El generador de códigos de Windows Machine Learning mlgen crea una interfaz (para C#, C++/WinRT y C++/CX) con clases contenedoras que llaman automáticamente a la API de Windows ML. Esto le permite cargar, enlazar y evaluar fácilmente un modelo en el proyecto. Lo usaremos en este tutorial para controlar muchas de esas funciones.

El generador de código está disponible para Visual Studio 2017 y versiones posteriores. Tenga en cuenta que en Windows 10, versión 1903 y posteriores, mlgen ya no se incluye en el SDK de Windows 10, de modo que debe descargar e instalar la extensión. Si ha seguido este tutorial desde la introducción, ya lo habrá abordado, pero si no es así, debe descargar para VS 2019 o para VS 2017.

Nota:

Para más información sobre mlgen, consulte la documentación de mlgen.

Si todavía no lo ha hecho, instale mlgen.
Haga clic con el botón derecho en la carpeta Assets, en el Explorador de soluciones de Visual Studio, y seleccione Add > Existing Item.
Vaya a la carpeta assets dentro de ImageClassifierAppUWP [….\ImageClassifierAppUWP\Assets], busque el modelo de ONNX que copió anteriormente y seleccione add.
Después de agregar un modelo ONNX (nombre: "clasificador") a la carpeta assets del Explorador de soluciones en VS, el proyecto debería tener ahora dos nuevos archivos:

bestModel.onnx: el modelo en formato ONNX.
bestModel.cs: archivo de código WinML generado automáticamente.

Estructura del proyecto con el modelo ONNX agregado

Para asegurarse de que se crea el modelo al compilar la aplicación, seleccione el archivo bestModel.onnx y elija Properties. En Build Action, seleccione Content.

Ahora, vamos a explorar el código recién generado en el bestModel.cs archivo.

El código generado incluye tres clases:

bestModelModel: esta clase incluye dos métodos para la creación de instancias del modelo y la evaluación del modelo. Eso nos ayudará a crear la representación del modelo de aprendizaje automático, crear una sesión en el dispositivo predeterminado del sistema, enlazar las entradas y salidas específicas al modelo y evaluar el modelo de forma asincrónica.
bestModelInput: esta clase inicializa los tipos de entrada que el modelo espera. La entrada del modelo depende de los requisitos del modelo para los datos de entrada.
bestModelOutput: esta clase inicializa los tipos que el modelo generará. La salida del modelo depende de cómo la defina el modelo.

Ahora usará estas clases para cargar, enlazar y evaluar el modelo en nuestro proyecto.

Conversión de Tensor

Para facilitar el tratamiento con la tensorización, cambie la clase de entrada TensorFloat a ImageFeatureValue.

Realice los siguientes cambios en el archivo bestModel.cs:

El código:

public sealed class bestModelInput
    {
        public TensorFloat input; // shape(-1,3,32,32)
    }

Se convertirá en:

public sealed class bestModelInput
    {
        public ImageFeatureValue input; // shape(-1,3,32,32)
    }

Carga del modelo y las entradas

Carga del modelo

Haga doble clic en el archivo de código MainPage.xaml.cs para abrir el código de la aplicación.
Reemplace las instrucciones "using" por las siguientes para obtener acceso a todas las APIs que necesitas.

// Specify all the using statements which give us the access to all the APIs that you'll need
using System;
using System.Threading.Tasks;
using Windows.AI.MachineLearning;
using Windows.Graphics.Imaging;
using Windows.Media;
using Windows.Storage;
using Windows.Storage.Pickers;
using Windows.Storage.Streams;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media.Imaging;

Agregue las siguientes declaraciones de variable después de las instrucciones using dentro de la clase MainPage, en el espacio de nombres classifierMLNETModel.

		// All the required fields declaration
		private bestModelModel modelGen;
		private bestModelInput image = new bestModelInput();
		private bestModelOutput results;
		private StorageFile selectedStorageFile;
		private string label = "";
		private float probability = 0;
		private Helper helper = new Helper();

		public enum Labels
		{
			desert,
			soup,
			vegetable_fruit,
		}

Ahora, implementará el método LoadModel. El método accederá al modelo de ONNX y lo almacenará en memoria. A continuación, usará el método CreateFromStreamAsync para crear una instancia del modelo como un objeto LearningModel. La clase LearningModel representa un modelo de aprendizaje automático entrenado. Una vez creada una instancia, LearningModel es el objeto inicial que se usa para interactuar con Windows ML.

Para cargar el modelo, puede usar varios métodos estáticos en la clase LearningModel. En este caso, usará el método CreateFromStreamAsync.

El método CreateFromStreamAsync se creó automáticamente con mlgen, por lo que no es necesario implementar este método. Puede revisar este método haciendo doble clic en el archivo bestModel.cs generado por mlgen.

Para obtener más información sobre la clase , consulte la documentación de la clase LearningModel .

Para obtener más información sobre las formas adicionales de cargar el modelo, consulte la documentación de carga de un modelo.

Vamos a definir el método principal.

// The main page to initialize and execute the model.
public MainPage()
{
	this.InitializeComponent();
	loadModel();
}

Agregue la implementación del loadModel método al MainPage.xaml.cs archivo de código dentro de la MainPage clase .

private async Task loadModel()
{
// Get an access the ONNX model and save it in memory. 
	StorageFile modelFile = await StorageFile.GetFileFromApplicationUriAsync(new Uri($"ms-appx:///Assets/bestModel.onnx"));
// Instantiate the model. 
	modelGen = await bestModelModel.CreateFromStreamAsync(modelFile);
}

Carga de la imagen

Es necesario definir un evento de clic para iniciar la secuencia de cuatro llamadas del método para la ejecución del modelo: conversión, enlace y evaluación, extracción de salida y visualización de los resultados. Agregue el método siguiente al archivo de código MainPage.xaml.cs dentro de la clase MainPage.

        // Waiting for a click event to select a file 
        private async void OpenFileButton_Click(object sender, RoutedEventArgs e)
        {
            if (!await getImage())
            {
                return;
            }
            // After the click event happened and an input selected, begin the model execution. 
            // Bind the model input
            await imageBind();
            // Model evaluation
            await evaluate();
            // Extract the results
            extractResult();
            // Display the results  
            await displayResult();
        }

Ahora, implementará el método getImage(). Este método seleccionará un archivo de imagen de entrada y lo guardará en memoria. Agregue el método siguiente al archivo de código MainPage.xaml.cs dentro de la clase MainPage.

        // A method to select an input image file
        private async Task<bool> getImage()
        {
            try
            {
                // Trigger file picker to select an image file
                FileOpenPicker fileOpenPicker = new FileOpenPicker();
                fileOpenPicker.SuggestedStartLocation = PickerLocationId.PicturesLibrary;
                fileOpenPicker.FileTypeFilter.Add(".jpg");
                fileOpenPicker.FileTypeFilter.Add(".png");
                fileOpenPicker.ViewMode = PickerViewMode.Thumbnail;
                selectedStorageFile = await fileOpenPicker.PickSingleFileAsync();
                if (selectedStorageFile == null)
                {
                    return false;
                }
            }
            catch (Exception)
            {
                return false;
            }
            return true;
        }

A continuación, implementará un método Bind() de imagen para obtener la representación del archivo en el formato BGRA8 del mapa de bits. Pero, en primer lugar, creará una clase auxiliar para cambiar el tamaño de la imagen.

Para crear un archivo auxiliar, haga clic con el botón derecho en el nombre de la solución (ClassifierPyTorch) y elija Add a new item. En la ventana abierta, seleccione Class y asígnele un nombre. Aquí, lo llamamos Helper.

Agregar un archivo auxiliar

Aparecerá un nuevo archivo de clase dentro del proyecto. Abra esta clase y agregue el código siguiente:

using System; 
using System.Threading.Tasks; 
using Windows.Graphics.Imaging; 
using Windows.Media; 

namespace classifierPyTorch 
{ 
    public class Helper 
    { 
        private const int SIZE = 32;  
        VideoFrame cropped_vf = null; 
 
        public async Task<VideoFrame> CropAndDisplayInputImageAsync(VideoFrame inputVideoFrame) 
        { 
            bool useDX = inputVideoFrame.SoftwareBitmap == null; 

            BitmapBounds cropBounds = new BitmapBounds(); 
            uint h = SIZE; 
            uint w = SIZE; 
            var frameHeight = useDX ? inputVideoFrame.Direct3DSurface.Description.Height : inputVideoFrame.SoftwareBitmap.PixelHeight; 
            var frameWidth = useDX ? inputVideoFrame.Direct3DSurface.Description.Width : inputVideoFrame.SoftwareBitmap.PixelWidth; 
 
            var requiredAR = ((float)SIZE / SIZE); 
            w = Math.Min((uint)(requiredAR * frameHeight), (uint)frameWidth); 
            h = Math.Min((uint)(frameWidth / requiredAR), (uint)frameHeight); 
            cropBounds.X = (uint)((frameWidth - w) / 2); 
            cropBounds.Y = 0; 
            cropBounds.Width = w; 
            cropBounds.Height = h; 
 
            cropped_vf = new VideoFrame(BitmapPixelFormat.Bgra8, SIZE, SIZE, BitmapAlphaMode.Ignore); 
 
            await inputVideoFrame.CopyToAsync(cropped_vf, cropBounds, null); 
            return cropped_vf; 
        } 
    } 
}

Ahora, vamos a convertir la imagen al formato adecuado.

La clase bestModelInput inicializa los tipos de entrada que el modelo espera. En nuestro caso, hemos configurado el código para esperar un tipo ImageFeatureValue.

La clase ImageFeatureValue describe las propiedades de la imagen usada para pasar a un modelo. Para crear unImageFeatureValue, use el método CreateFromVideoFrame. Para obtener detalles más específicos sobre por qué este es el caso y cómo funcionan estas clases y métodos, consulte la documentación de la clase ImageFeatureValue.

Nota:

En este tutorial, se usa la clase ImageFeatureValue en lugar de un tensor. Si Windows ML no admite el formato de color del modelo, esta no será una opción. Para obtener un ejemplo de cómo trabajar con conversiones de imágenes y tensorización, consulte el ejemplo de tensorización personalizada.

Agregue la implementación del método convert() al archivo de código MainPage.xaml.cs dentro de la clase MainPage. El método de conversión nos dará una representación del archivo de entrada en un formato BGRA8.

// A method to convert and bind the input image.  
        private async Task imageBind()
        {
            UIPreviewImage.Source = null;
            try
            {
                SoftwareBitmap softwareBitmap;
                using (IRandomAccessStream stream = await selectedStorageFile.OpenAsync(FileAccessMode.Read))
                {
                    // Create the decoder from the stream 
                    BitmapDecoder decoder = await BitmapDecoder.CreateAsync(stream);
                    // Get the SoftwareBitmap representation of the file in BGRA8 format
                    softwareBitmap = await decoder.GetSoftwareBitmapAsync();
                    softwareBitmap = SoftwareBitmap.Convert(softwareBitmap, BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied);
                }
                // Display the image
                SoftwareBitmapSource imageSource = new SoftwareBitmapSource();
                await imageSource.SetBitmapAsync(softwareBitmap);
                UIPreviewImage.Source = imageSource;

				// Encapsulate the image within a VideoFrame to be bound and evaluated
            	VideoFrame inputImage = VideoFrame.CreateWithSoftwareBitmap(softwareBitmap);
              	// Resize the image size to 224x224 
              	inputImage=await helper.CropAndDisplayInputImageAsync(inputImage);
              	// Bind the model input with image
              	ImageFeatureValue imageTensor = ImageFeatureValue.CreateFromVideoFrame(inputImage);
				image.input1 = imageTensor;

				// Encapsulate the image within a VideoFrame to be bound and evaluated
				VideoFrame inputImage = VideoFrame.CreateWithSoftwareBitmap(softwareBitmap);
				// Bind the input image
				ImageFeatureValue imageTensor = ImageFeatureValue.CreateFromVideoFrame(inputImage);
				image.modelInput = imageTensor;

            }
            catch (Exception e)
            {
            }
        }

Vincular y evaluar el modelo

A continuación, creará una sesión basada en el modelo, enlazará la entrada y la salida de la sesión y evaluará el modelo.

Cree una sesión para enlazar el modelo:

Para crear una sesión, se usa la clase LearningModelSession. Esta clase se usa para evaluar modelos de aprendizaje automático y enlaza el modelo a un dispositivo que, a continuación, ejecuta y evalúa el modelo. Puede seleccionar un dispositivo al crear una sesión para ejecutar el modelo en un dispositivo específico de la máquina. El dispositivo predeterminado es la CPU.

Nota:

Para obtener más información sobre cómo elegir un dispositivo, revise la documentación Sobre la creación de una sesión .

Enlace de las entradas y salidas del modelo:

Para enlazar la entrada y la salida, use la LearningModelBinding clase . Un modelo de aprendizaje automático tiene características de entrada y salida, que pasan información hacia y hacia fuera del modelo. Tenga en cuenta que las características necesarias deben ser compatibles con a API de Windows ML. La clase LearningModelBinding se aplica a una clase LearningModelSession para enlazar valores a características de entrada y salida con nombre.

mlgen genera automáticamente la implementación del enlace, por lo que no tiene que ocuparse de él. El enlace se implementa llamando a los métodos predefinidos de la clase LearningModelBinding. En nuestro caso, usa el método Bind para enlazar un valor al tipo de característica con nombre.

Evaluación del modelo:

Después de crear una sesión para enlazar el modelo y los valores enlazados a las entradas y salidas de un modelo, puede evaluar las entradas del modelo y obtener sus predicciones. Para ejecutar el modelo, debe llamar a cualquiera de los métodos de evaluación predefinidos en LearningModelSession. En nuestro caso, usaremos el método EvaluateAsync.

De forma similar a CreateFromStreamAsync, el generador de código WinML también genera automáticamente el método EvaluateAsync, por lo que no es necesario implementar este método. Puede revisar este método en el archivo bestModel.cs.

El método EvaluateAsync evaluará de forma asincrónica el modelo de Machine Learning con los valores de característica ya enlazados en los enlaces. Creará una sesión con LearningModelSession, enlazará la entrada y la salida con LearningModelBinding, ejecutará la evaluación del modelo y obtendrá las características de salida del modelo mediante la clase LearningModelEvaluationResult.

Nota:

Para obtener información sobre otros métodos de evaluación para ejecutar el modelo, compruebe qué métodos se pueden implementar en LearningModelSession revisando la documentación de la clase LearningModelSession.

Agregue el método siguiente al archivo de código MainPage.xaml.cs dentro de la clase MainPage para crear una sesión, y enlazar y evaluar el modelo.

        // A method to evaluate the model
        private async Task evaluate()
        {
            results = await modelGen.EvaluateAsync(image);
        }

Extracción y visualización de los resultados

Ahora deberá extraer la salida del modelo y mostrar el resultado correcto, lo que hará mediante la implementación de los métodos extractResult y displayResult. Deberá encontrar la probabilidad mayor para devolver la etiqueta correcta.

Agregue el método extractResult al archivo de código MainPage.xaml.cs dentro de la clase MainPage.

        // A method to extract output from the model 
        private void extractResult()
        {
            // Retrieve the results of evaluation
            var mResult = results.modelOutput as TensorFloat;
            // convert the result to vector format
            var resultVector = mResult.GetAsVectorView();
            
            probability = 0;
            int index = 0;
            // find the maximum probability
            for(int i=0; i<resultVector.Count; i++)
            {
                var elementProbability=resultVector[i];
                if (elementProbability > probability)
                {
                    index = i;
                }
            }
            label = ((Labels)index).ToString();
        }

Agregue el método displayResult al archivo de código MainPage.xaml.cs dentro de la clase MainPage.

        private async Task displayResult() 
        {
            displayOutput.Text = label; 
        }

Ya está Ha creado correctamente la aplicación de aprendizaje automático de Windows con una GUI básica para probar nuestro modelo de clasificación. El siguiente paso consiste en iniciar la aplicación y ejecutarla localmente en el dispositivo de Windows.

Inicio de la aplicación

Una vez completada la interfaz de aplicación, agregado el modelo y generado el código de Windows ML, puede probar la aplicación.

Habilite el modo de desarrollador y pruebe la aplicación desde Visual Studio. Asegúrese de que los menús desplegables de la barra de herramientas superior estén configurados a Debug. Cambie la plataforma de soluciones a x64 para ejecutar el proyecto en la máquina local si el dispositivo es de 64 bits o a x86 si el dispositivo es de 32 bits.

Para probar nuestra aplicación, vamos a usar la siguiente imagen de sopa. Veamos cómo clasifica la aplicación el contenido de la imagen.

Imagen para las pruebas de aplicaciones

Guarde esta imagen en el dispositivo local para probar la aplicación. Cambie el formato de imagen a .jpg si es necesario. También puede agregar cualquier otra imagen relevante desde el dispositivo local en un .jpg formato o .png .
Para ejecutar el proyecto, seleccione el botón Start Debugging de la barra de herramientas o presione F5.
Cuando se inicie la aplicación, presione Pick Image y seleccione la imagen del dispositivo local.

Interfaz de aplicación

El resultado aparecerá en la pantalla de inmediato. Como puede ver, nuestra aplicación de Windows ML clasificó correctamente la imagen como una sopa.

Clasificación correcta en la aplicación

Resumen

Acaba de crear su primera aplicación de Windows Machine Learning, desde la creación del modelo hasta la ejecución correcta.

Recursos adicionales

Para obtener más información sobre los temas mencionados en este tutorial, visite los siguientes recursos:

Herramientas de Windows ML: obtenga más información sobre herramientas como el panel de Windows ML, WinMLRunner y el generador de código mglen Windows ML.
Modelo ONNX: obtenga más información sobre el formato ONNX.
Rendimiento y memoria de Windows ML: obtenga más información sobre cómo administrar el rendimiento de las aplicaciones con Windows ML.
Referencia de la API de Windows Machine Learning: obtenga más información sobre tres áreas de las API de Windows ML.

Comentarios

¿Le ha resultado útil esta página?

Last updated on 2025-06-10

Compartir a través de

Implementación del modelo de ML.NET en una aplicación de Windows con las API de Windows Machine Learning

Acerca de la aplicación de ejemplo

Crear una aplicación UWP WinML (C#)

Creación de la aplicación

Exploración de la solución de proyecto

Creación de la GUI de aplicación

Adición del modelo al proyecto mediante el generador de código de Windows Machine Learning

Conversión de Tensor

Carga del modelo y las entradas

Carga del modelo

Carga de la imagen

Vincular y evaluar el modelo

Cree una sesión para enlazar el modelo:

Enlace de las entradas y salidas del modelo:

Evaluación del modelo:

Extracción y visualización de los resultados

Inicio de la aplicación

Resumen

Recursos adicionales

Comentarios

Recursos adicionales