Freelance Project Requests info@CodeDocu.de Software Development in C# WPF Asp.Net Core Vba Excel Word SQL-Server EF Linq, UWP Net
#

UWP,NuGet: Installation von UWP MyToolkit

 

Betrifft: Windows 10 Universal App

In dem Nuget Packet MyToolKit sind einige praktische Controls und Elemente, die man kostenlos für Universal Apps versenden kann.

Zum Beispiel enthält es eine einfache DataGrid Liste, die eine Sortierung, Filterung und eine Spalten-/Column-Header aufweist.

 

Zur Installation muss man das Toolkit mit NuGet Pakete installieren

 

Auswahl des MyToolKit.Extended für das Verwenden von DataGrid

 

Package: MyToolkit.Extended

Platforms: WinRT, UWP

Data grid control to display data in a table.

 

Unter GitHub https://github.com/MyToolkit/MyToolkit

 

Zum Abschluss der Nuget Package gibt der Paket-Manager die erfolgreiche Installation aus.

Wichtig ist, dass die UAP Kompatibel gemeldet wird.

 

 

 

Controls-Namespace in Page eintragen:

Die Controls in XAML Toolbox Registerkarten einzubinden habe ich nicht geschafft, da dieses auf /Packages… referenziert werden muss.

Aber man kann die Controls und MyToolbox Elemente auch direkt übernehmen, indem man die Erweiterung der Namespaces in den Head/Namespace-Bereich der Page schreibt so wie hier

Einfach dort einfügen: xmlns:Toolkit="using:MyToolkit.Controls"

 

sobald man xmlns:MyToolKit= eintippt, kommt die Auswahl per Intellisenese

 

Hier der Namespace Bereich. Die MyToolkits werden in diesem Fall mit dem Prefix ToolKit: eingefügt

<Page

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    xmlns:local="using:Win10_Fritzbox_Contacts_To_Smartphone"

    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

    x:Class="Win10_Fritzbox_Contacts_To_Smartphone.MainPage"

    xmlns:Toolkit="using:MyToolkit.Controls"

    mc:Ignorable="d"   Loaded="Page_Loaded" Loading="Page_Loading"   >

 

    <Page.DataContext>

        <local:ViewModel/>

    </Page.DataContext>

 

 

Control einfügen in Page:

Einzelnes Control wie hier das DataGrid in die Page einfügen.

Zum Einfügen muss man nur <ToolKit: eintippen.

Danach kommt automatisch die Auswahl der Controls/Elemente, die in dem Namespace / Nuget Paket enthalten sind

xmlns:Toolkit="using:MyToolkit.Controls"

 

Aufbau einer Telefonliste

Hier ein exemplarischer Aufbau einer myToolkit: DataGrid  Liste

<DataGrid>

DataGridTextColumns

ItemDetailsTemplate

</DataGrid>

 

<Toolkit:DataGrid x:Name="ctlTelefonlist" Grid.Row="1"  ItemsSource="{Binding Data}"  VerticalAlignment="Top" HorizontalAlignment="Stretch">

 

    <Toolkit:DataGrid.Columns>

       <Toolkit:DataGridTextColumn Width="200" Header="Kontakt_Name"  Binding="{Binding Kontakt_Name}"  IsAscendingDefault="True" />

       <Toolkit:DataGridTextColumn Width="200" Header="Kontakt_Nummer" Binding="{Binding Kontakt_Nummer}" />

    </Toolkit:DataGrid.Columns>

 

    <Toolkit:DataGrid.ItemDetailsTemplate>

     <DataTemplate>

       <StackPanel Margin="10,10,10,5" >

         <TextBlock Text="{Binding Kontakt_Name}" />

         <TextBlock Text="{Binding Kontakt_Nummer}" />

       </StackPanel>

      </DataTemplate>

    </Toolkit:DataGrid.ItemDetailsTemplate>

</Toolkit:DataGrid>

 

Die obige Liste führt zu einer Telefonliste wie hier angezeigt.

Umsetzung in der Telefonliste

 

 

 

 

Der C# Code zum Laden im Hintergrund ist recht einfach

Zunächst muss in der C# Codebehind Datei der Page ein Block mit dem Viewmodel stehen

#region ViewModel

    //========================< ViewModel >========================

    public class ViewModel

    {

        //----------------< Class: ViewModel >----------------

        public ViewModel()

        {

            //----------< ViewModel() >---------

            //*der eigentliche Aufruf, Initialisierung. Hier kann man Vorgabedaten fuellen

            // data

            //var _Data = Enumerable.Range(1, 20)

            //    .Select(x => new Datum { Date = DateTime.Now.Add(TimeSpan.FromDays(x * 14)) });

            //Data = new ObservableCollection<Datum>(_Data);

            //----------</ ViewModel() >---------

        }

 

        //< Data >

        //*daten als Collection, vom Typ Kontakte

        public ObservableCollection<tblRowDef_Kontakte> Data { get; private set; }

        //</ Data >

        //----------------</ Class: ViewModel >----------------

    }

 

 

    public class tblRowDef_Kontakte

    {

        //----------------< tblRowDef_Kontakte() >----------------

        //*beschribt die Kontakte Tabellenstruktur

        public string Kontakt_Name{get;set;}

        public string Kontakt_Nummer{get;set;}

        //----------------</ tblRowDef_Kontakte() >----------------

    }

 

    //========================</ ViewModel >========================

    #endregion

 

 

 

Dann wird das DataGrid zur Laufzeit geladen

List<tblRowDef_Kontakte> listTelefon= new List<tblRowDef_Kontakte>();

 

                //--< Nodes ausgeben >--

                //Suche <table id="uiInnerTable" class="zebra_reverse">

                HtmlNode docNodes = htmlDoc.DocumentNode;

                var tr_List = docNodes.Descendants("tr");

                //< anzeigen >

                foreach (HtmlNode tr in tr_List)

                {

                    //fl_Add_Log(tr.InnerText);

 

                    var td_List = tr.Descendants("td");

                    string sName = "";

                    string sRufnummer = "";

                    string sType = "";

                    foreach (HtmlNode td in td_List)

                    {

                        if (td.Attributes["class"].Value   == "tname") { sName = td.InnerText; }

                        else if (td.Attributes["class"].Value == "tnum") { sRufnummer = td.InnerText; }

                        else if (td.Attributes["class"].Value == "ttype") { sType = td.InnerText; }                       

                    }

                    tblRowDef_Kontakte row = new tblRowDef_Kontakte { Kontakt_Name = sName, Kontakt_Nummer = sRufnummer };

                    listTelefon.Add(row);

                }

                //</ anzeigen >

 

                ctlTelefonlist.ItemsSource = listTelefon;

                //--</ Nodes ausgeben >-- 

 

 

 

 

 

Beschreibung und Quellen zu MyToolKit

 

MyTools Controls und Elemente werden beschrieben unter

https://github.com/MyToolkit/MyToolkit/wiki

 

Ein Beispiel zum Einbinden eines MyTool.DataGrid ist unter

https://github.com/MyToolkit/MyToolkit/wiki/DataGrid

 

 

Mobile
»
Internal Note: Insider Feedback on Visual Studio and UWP
»
ASP.NET: Shall I Change now to ASP.Net core?
»
Comparison of the importance of Microsoft software projects to market shares for jobs and projects
»
UWP,NuGet: Installation von UWP MyToolkit
»
UWP,XAML: Listen in ItemsControl vs ListBox
»
Sony Entwickler Seite
»
Facebook meldet seit heute stets den Fehler ...findet deine Anfrage verwirrend
»
Tip: Alle große Fotos in kleine JPG Bilder konvertieren für Upload im Internet
»
Große Fotos in kleine JPG Dateien kopieren
»
Alle Fotos aus einem Ordner per Makro in einem Word-Dokument speichern

.

Contact for Jobs, Project Requests: raimund.popp@microsoft-programmierer.de