![\"Anlegen](\"..\/fileadmin\/_temp_\/2023_06\/pic_413_001.png\")
<\/p>\nEiner der wenigen Schritte, die wir nicht mit klassischem Visual Basic oder per VBA abgebildet haben, ist das Ermitteln eines OAuth2-Tokens für Rest-APIs wie die von Google oder anderen Anbietern. Die Aufgabe ist, mit den online einmalig ermittelten Daten Client-ID und Client-Secret ein Access-Token oder noch besser ein Refresh-Token zu holen. Das Access-Token ist in der Regel zeitlich begrenzt, das Refresh-Token ist haltbarer und ermöglicht es uns, neue Access-Token zu holen – dies übrigens mit einer reinen VB6\/VBA-Prozedur. In diesem Artikel zeigen wir, wie wir eine kleine Anwendung mit Benutzeroberfläche auf Basis von WPF\/VB.NET in Visual Studio erstellen. Diese soll die Eingabe von Client-ID und Client-Secret erlauben und dafür die Werte eines Refresh- und eines Access-Tokens zurückliefern.<\/b><\/p>\nProjekt erstellen<\/h2>\n
Nach dem Starten von Visual Studio, in diesem Fall in der Version 2022, legen wir ein neues Projekt des Typs WPF-Anwendung <\/b>an. Um dieses schnell anzuzeigen, wählen wir als Filter Visual Basic<\/b>, Windows <\/b>und Desktop <\/b>aus (siehe Bild 1).<\/p>\n
<\/p>\n
Bild 1: Anlegen einer WPF-Anwendung<\/span><\/b><\/p>\n Damit landen wir beim zweiten Schritt, wo wir das Projekt konfigurieren. Hier legen wir den Projektnamen fest und den Namen der Projektmappe (in diesem Fall identisch) und wählen den Speicherort für das Projekt aus (siehe Bild 2). Im nächsten Schritt behalten wir die Voreinstellung bei und erstellen das Projekt.<\/p>\n Bild 2: Konfigurieren des Projekts<\/span><\/b><\/p>\n Danach finden wir den Entwurf des Startfensters der Anwendung namens MainWindow.xaml <\/b>vor. Hier können wir nun die Steuerelemente anlegen, die wir für die Anwendung benötigen. Wir benötigen:<\/p>\n Damit wir die Schaltflächen klein halten können, verwenden wir, soweit möglich, Icons zur Beschreibung der Funktion. So können wir zum Beispiel für die Schaltflächen btnCopyRefreshToken<\/b> und btnCopyAccessToken <\/b>das übliche Icon für das Kopieren in die Zwischenablage verwenden.<\/p>\n Um Icons zu verwalten, fügen wir dem Projekt einen Ordner namens Images <\/b>hinzu. In dieses ziehen wir die zu verwenden Icons aus dem jeweiligen Ordner aus dem Windows Explorer hinein. Dazu können wir eine spezielle Instanz des Windows Explorers öffnen, aus dem wir sicher Dateien in das Projekt ziehen können. Dazu betätigen wir, während Visual Studio aktiviert ist, die Tastenkombination Strg + O<\/b>. Dann stellen wir für die Elemente des Ordners Images <\/b>noch die Eigenschaft Buildvorgang <\/b>auf Ressource <\/b>ein. Nur so werden diese in den Buildvorgang integriert und erscheinen auch in der Anwendung (siehe Bild 3).<\/p>\n Bild 3: Einstellen der Bilddatei-Eigenschaften<\/span><\/b><\/p>\n Neben den Schaltflächen soll auch das Hauptfenster selbst ein Icon erhalten – und eine entsprechende Beschriftung. Dazu stellen wir in dem Gerüst der Seite MainWindow.xaml<\/b>, das beim Erstellen des Projekts automatisch angelegt wurde, für das Hauptelement Window <\/b>die Attribute Title<\/b> und Icon <\/b>entsprechend ein (siehe Listing 1).<\/p>\n Listing 1: Definition des Hauptfensters der Anwendung<\/span><\/b><\/p>\n Danach folgt der Abschnitt Windows.Resources<\/b>. Hier legen wir Standardwerte für einige Attribute bestimmter Steuerelemente fest. Danach folgt das Grid<\/b>-Element, in dem wir im Abschnitt Grid.RowDefinitions <\/b>die Zeilen definieren und im Abschnitt Grid.ColumnDefinitions <\/b>die Spalten. Die Höhe der RowDefinition<\/b>-Elemente legen wir mit dem Attribut Height <\/b>jeweils auf Auto <\/b>fest, damit diese sich an die Höhe der enthaltenen Steuerelemente anpasst. Einzige Ausnahme ist die letzte Zeile, welche wir auf * <\/b>einstellen und die so den verbleibenden Platz einnimmt.<\/p>\n Die Breite der Spalten definieren wir mit dem Attribut Width <\/b>der ColumnDefinition<\/b>-Elemente. Die erste und die letzten Spalte sollen sich an der Breite der enthaltenen Steuerelemente orientieren, die mittlere soll den verbleibenden Platz einnehmen. Dadurch erstrecken sich die in der mittleren Spalte enthaltenen Textfelder, sofern nicht anders festgelegt, über die gesamte Breite der mittleren Spalte. Wenn der Benutzer die Breite des Fensters einstellt, passt er somit auch die Breite der Textfelder an.<\/p>\n Die Position der Steuerelemente innerhalb des Grids wird durch die Attribute Grid.Column <\/b>und Grid.Row <\/b>definiert. Für die Schaltflächen hinterlegen wir mit dem Click<\/b>-Attribut entsprechende Ereignisprozeduren, die im Code behind-Modul angelegt werden.<\/p>\n Nach dem Hinzufügen der Steuerelemente, wie durch die XAML-Definition aus dem Listing geschehen, sieht der Entwurf des Fensters wie in Bild 4 aus.<\/p>\n Möchten Sie weiterlesen? Dann lösen Sie Ihr Ticket!<\/span>![\"Konfigurieren](\"..\/fileadmin\/_temp_\/2023_06\/pic_413_002.png\")
<\/p>\nBenutzeroberfläche definieren<\/h2>\n
\n
Icons für die Schaltflächen<\/h2>\n
![\"Einstellen](\"..\/fileadmin\/_temp_\/2023_06\/pic_413_004.png\")
<\/p>\nCode des WPF-Fensters für die Anwendung<\/h2>\n
<Window x:Class=\"MainWindow\"\r\n ...\r\n Title=\"amvGetGoogleToken\" Height=\"350\" Width=\"800\" Icon=\"Images\/key.ico\">\r\n <Window.Resources>...<\/Window.Resources>\r\n <Grid>\r\n <Grid.RowDefinitions>...<\/Grid.RowDefinitions>\r\n <Grid.ColumnDefinitions>...<\/Grid.ColumnDefinitions>\r\n <TextBlock Grid.ColumnSpan=\"3\" Height=\"50\" Width=\"350\" HorizontalAlignment=\"Left\" TextWrapping=\"Wrap\">Gib die \r\n Client-ID und das Client-Secret ein und klicke auf die Refresh-Schaltfläche, um Refresh-Token und Access-\r\n Token zu erhalten.<\/TextBlock>\r\n <Label Grid.Row=\"1\">Client-ID:<\/Label>\r\n <TextBox x:Name=\"txtClientID\" Width=\"Auto\" Margin=\"5\" Grid.Column=\"1\" Grid.Row=\"1\"><\/TextBox>\r\n <Button x:Name=\"btnLoadClientdata\" Grid.Row=\"1\" Grid.Column=\"2\" HorizontalAlignment=\"left\" \r\n Click=\"btnLoadClientdata_Click\" Background=\"Transparent\" BorderBrush=\"Transparent\">\r\n <Image Source=\"Images\/folder.ico\" Width=\"24\" Height=\"24\"><\/Image>\r\n <\/Button>\r\n <Label Grid.Row=\"2\">Client-Secret:<\/Label>\r\n <TextBox x:Name=\"txtClientSecret\" Width=\"Auto\" Margin=\"5\" Grid.Row=\"2\" Grid.Column=\"1\"><\/TextBox>\r\n <Label Grid.Row=\"3\">Refresh-Token:<\/Label>\r\n <TextBox x:Name=\"txtRefreshToken\" Width=\"Auto\" Margin=\"5\" Grid.Row=\"3\" Grid.Column=\"1\"><\/TextBox>\r\n <StackPanel Grid.Row=\"3\" Grid.Column=\"2\" Orientation=\"Horizontal\">\r\n <Button x:Name=\"btnCopyRefreshToken\" Click=\"btnCopyRefreshToken_Click\" Background=\"Transparent\" \r\n BorderBrush=\"transparent\">\r\n <Image Source=\"Images\/Copy.ico\" Width=\"24\" Height=\"24\"><\/Image>\r\n <\/Button>\r\n <Button x:Name=\"btnRefresh\" Click=\"btnRefresh_Click\" Background=\"Transparent\" BorderBrush=\"transparent\">\r\n <Image Source=\"Images\/refresh.ico\" Width=\"24\" Height=\"24\"><\/Image>\r\n <\/Button>\r\n <\/StackPanel>\r\n <Label Grid.Row=\"4\">Access-Token:<\/Label>\r\n <TextBox x:Name=\"txtAccessToken\" Width=\"Auto\" Margin=\"5\" Grid.Row=\"4\" Grid.Column=\"1\"><\/TextBox>\r\n <Button x:Name=\"btnCopyAccessToken\" Grid.Row=\"4\" Grid.Column=\"2\" HorizontalAlignment=\"left\" \r\n Click=\"btnCopyRefreshToken_Click\" Background=\"Transparent\" BorderBrush=\"Transparent\">\r\n <Image Source=\"Images\/Copy.ico\" Width=\"24\" Height=\"24\"><\/Image>\r\n <\/Button>\r\n <Label Grid.Row=\"5\">Gültig bis:<\/Label>\r\n <TextBox x:Name=\"txtExpiresAt\" Width=\"150\" HorizontalAlignment=\"left\" Grid.Row=\"5\" Grid.Column=\"1\"><\/TextBox>\r\n <Button x:Name=\"btnOK\" Grid.Row=\"6\" Click=\"btnOK_Click\" Margin=\"5\">\r\n <StackPanel Orientation=\"Horizontal\">\r\n <Image Source=\"Images\/ok.ico\" Width=\"16\" Height=\"16\"><\/Image>\r\n <Label Padding=\"0\">OK<\/Label>\r\n <\/StackPanel>\r\n <\/Button>\r\n <\/Grid>\r\n<\/Window><\/pre>\n
![\"Entwurf](\"..\/fileadmin\/_temp_\/2023_06\/pic_413_003.png\")
<\/p>\n
\nHier geht es zur Bestellung des Jahresabonnements des Magazins Visual Basic Entwickler<\/strong>:<\/span>
\nZur Bestellung ...<\/a><\/span>
\nDanach greifen Sie sofort auf alle rund 200 Artikel<\/strong> unseres Angebots zu - auch auf diesen hier!<\/span>
\nOder haben Sie bereits Zugangsdaten? Dann loggen Sie sich gleich hier ein:<\/span><\/p>\n<\/div>\n\n\t\n\t