{"id":55000281,"date":"2021-08-01T00:00:00","date_gmt":"2021-12-31T14:21:21","guid":{"rendered":"http:\/\/access-im-unternehmen.aix-dev.de\/aiu\/?p=281"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-30T00:00:00","slug":"Optionsgruppen_mit_GroupBox_und_RadioButtons","status":"publish","type":"post","link":"https:\/\/vbentwickler.de\/Optionsgruppen_mit_GroupBox_und_RadioButtons\/","title":{"rendered":"Optionsgruppen mit GroupBox und RadioButtons"},"content":{"rendered":"<p><b>Wer von Access kommt, hat vermutlich hier und da Optionsgruppen genutzt. Ein solches Steuerelement bietet WPF nicht direkt an. Allerdings gibt es Elemente, mit dem wir Optionsgruppen nachbauen k&ouml;nnen. Dabei handelt es sich um das GroupBox- und RadioButton-Steuerelement. Wie Sie damit Optionsgruppen mit Optionen nachbilden, zeigen wir in diesem Artikel.<\/b><\/p>\n<h2>Einfache Optionsgruppe mit dem GroupBox-Element<\/h2>\n<p>Wenn wir von Optionsgruppen reden, ben&ouml;tigen wir auch noch Optionsfelder. Diese bilden wir unter WPF mit dem <b>RadioButton<\/b>-Element ab. In der Definition einer Optionsgruppe k&ouml;nnen wir nicht einfach die ben&ouml;tigten <b>RadioButton<\/b>-Elemente unter dem <b>GroupBox<\/b>-Element anordnen. Der Grund daf&uuml;r ist, dass das <b>GroupBox<\/b>-Element nur ein weiteres Element direkt aufnehmen kann &#8211; also beispielsweise ein <b>StackPanel<\/b>-Element, um die Optionsfelder wie in Bild 1 nebeneinander oder untereinander anzuordnen.<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2021_04\/pic_281_001.png\" alt=\"Einfache GroupBox-Beispiele\" width=\"474,6267\" height=\"279,3844\" \/><\/p>\n<p><b><span style=\"color:darkgrey;\">Bild 1: Einfache GroupBox-Beispiele<\/span><\/b><\/p>\n<p>Die <b>GroupBox<\/b> mit horizontal angeordneten Elementen erhalten wir mit dem folgenden Code:<\/p>\n<pre>&lt;GroupBox Header=\"Ein GroupBox-Element\"&gt;\r\n     &lt;StackPanel Orientation=\"Horizontal\"&gt;\r\n         &lt;RadioButton&gt;Herr&lt;\/RadioButton&gt;\r\n         &lt;RadioButton&gt;Frau&lt;\/RadioButton&gt;\r\n         &lt;RadioButton&gt;Divers&lt;\/RadioButton&gt;\r\n     &lt;\/StackPanel&gt;\r\n&lt;\/GroupBox&gt;<\/pre>\n<p>Damit die Elemente den Abstand wie in der Abbildung angezeigt erhalten, haben wir noch das Attribut <b>Margin <\/b>f&uuml;r alle Elemente des Typs <b>RadioButton <\/b>angepasst &#8211; und gleich auch noch den inneren und &auml;u&szlig;eren Abstand des <b>GroupBox<\/b>-Elements:<\/p>\n<pre>&lt;Window.Resources&gt;\r\n     &lt;Style TargetType=\"GroupBox\"&gt;\r\n         &lt;Setter Property=\"Margin\" Value=\"5\"&gt;&lt;\/Setter&gt;\r\n         &lt;Setter Property=\"Padding\" Value=\"5\"&gt;&lt;\/Setter&gt;\r\n     &lt;\/Style&gt;\r\n     &lt;Style TargetType=\"RadioButton\"&gt;\r\n         &lt;Setter Property=\"Margin\" Value=\"0,0,5,0\"&gt;&lt;\/Setter&gt;\r\n     &lt;\/Style&gt;\r\n&lt;\/Window.Resources&gt;<\/pre>\n<p>Die Definition der <b>GroupBox <\/b>mit vertikal angeordneten Elementen lautet wie folgt, wobei der Unterschied im Wert f&uuml;r das Attribut <b>Orientation <\/b>des <b>StackPanel<\/b>-Elements liegt:<\/p>\n<pre>&lt;GroupBox Header=\"Noch ein GroupBox-Element\" Grid.Row=\"1\"&gt;\r\n     &lt;StackPanel Orientation=\"Vertical\"&gt;\r\n         &lt;RadioButton&gt;Herr&lt;\/RadioButton&gt;\r\n         &lt;RadioButton&gt;Frau&lt;\/RadioButton&gt;\r\n         &lt;RadioButton&gt;Divers&lt;\/RadioButton&gt;\r\n     &lt;\/StackPanel&gt;\r\n&lt;\/GroupBox&gt;<\/pre>\n<p>Wie wir aus den Beispielen erkennen k&ouml;nnen, bietet das <b>GroupBox<\/b>-Element prim&auml;r einen Rahmen und die M&ouml;glichkeit, oben in diesem Rahmen eine Bezeichnung einzuf&uuml;gen &#8211; und zwar mit dem Attribut <b>Header<\/b>.<\/p>\n<h2>GroupBox mit CheckBox-Elementen<\/h2>\n<p>Alternativ zu den <b>RadioButton<\/b>-Elementen k&ouml;nnen Sie auch <b>CheckBox<\/b>-Elemente nutzen:<\/p>\n<pre>&lt;GroupBox Header=\"GroupBox mit CheckBox-Elementen\" Grid.Row=\"2\"&gt;\r\n     &lt;StackPanel Orientation=\"Vertical\"&gt;\r\n         &lt;CheckBox&gt;Herr&lt;\/CheckBox&gt;\r\n         &lt;CheckBox&gt;Frau&lt;\/CheckBox&gt;\r\n         &lt;CheckBox&gt;Divers&lt;\/CheckBox&gt;\r\n     &lt;\/StackPanel&gt;\r\n&lt;\/GroupBox&gt;<\/pre>\n<p>Diese erscheinen wie in Bild 3.<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2021_04\/pic_281_007.png\" alt=\"GroupBox mit CheckBox-Elementen\" width=\"424,6267\" height=\"199,8244\"\/><\/p>\n<p><b><span style=\"color:darkgrey;\">Bild 2: GroupBox mit CheckBox-Elementen<\/span><\/b><\/p>\n<h2>Header der GroupBox gestalten<\/h2>\n<p>Das <b>Header<\/b>-Element der <b>GroupBox <\/b>k&ouml;nnen Sie im Gegensatz zu dem der Optionsgruppe aus Access beliebig gestalten. Dazu nehmen Sie das Attribut aus dem eigentlichen Element heraus und formulieren es als Property Element. Hier k&ouml;nnen Sie dann beispielsweise Attribute definieren, welche die Schriftart f&uuml;r den Inhalt des Headers festlegen. In folgendem Beispiel haben wir im Element <b>GroupBox.Header <\/b>ein <b>Label<\/b>-Element hinzugef&uuml;gt und dessen Attribut <b>FontWeight <\/b>auf <b>Bold <\/b>eingestellt:<\/p>\n<pre>&lt;GroupBox Grid.Row=\"2\"&gt;\r\n     &lt;GroupBox.Header&gt;\r\n         &lt;Label FontWeight=\"Bold\"&gt;GroupBox mit fetter &Uuml;berschrift&lt;\/Label&gt;\r\n     &lt;\/GroupBox.Header&gt;\r\n     &lt;StackPanel Orientation=\"Vertical\"&gt;\r\n         ...\r\n     &lt;\/StackPanel&gt;\r\n&lt;\/GroupBox&gt;<\/pre>\n<p>Das Ergebnis sehen Sie in Bild 2.<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2021_04\/pic_281_002.png\" alt=\"GroupBox mit fetter &Uuml;berschrift\" width=\"474,6267\" height=\"205,2016\"\/><\/p>\n<p><b><span style=\"color:darkgrey;\">Bild 3: GroupBox mit fetter &Uuml;berschrift<\/span><\/b><\/p>\n<p>Und Sie k&ouml;nnen nicht nur die Schriftart der &Uuml;berschrift der Optionsgruppe nach Belieben gestalten. Sie k&ouml;nnen dem <b>Header<\/b>-Element auch noch beliebige andere Elemente unterordnen &#8211; so k&ouml;nnen Sie beispielsweise auch noch ein Bild hinzuf&uuml;gen. Das Bild hinterlegen wir in einem neuen Ordner im Projekt namens <b>images<\/b>. Der Code zum Anzeigen des dort hinzugef&uuml;gten Bildes sieht wie folgt aus:<\/p>\n<pre>&lt;GroupBox Grid.Row=\"2\"&gt;\r\n     &lt;GroupBox.Header&gt;\r\n         &lt;StackPanel Orientation=\"Horizontal\"&gt;\r\n             &lt;Image Source=\"images\/users_meeting.png\"&gt;&lt;\/Image&gt;\r\n             &lt;Label FontWeight=\"Bold\"&gt;GroupBox mit fetter &Uuml;berschrift&lt;\/Label&gt;\r\n         &lt;\/StackPanel&gt;\r\n     &lt;\/GroupBox.Header&gt;\r\n     &lt;StackPanel Orientation=\"Vertical\"&gt;\r\n     ...\r\n     &lt;\/StackPanel&gt;\r\n&lt;\/GroupBox&gt;<\/pre>\n<p>Das Property Element <b>GroupBox.Header <\/b>kann ebenfalls nur ein Element in der ersten Ebene enthalten, daher fassen wir das <b>Image<\/b>&#8211; und das <b>Label<\/b>-Element in einem <b>StackPanel<\/b>-Element mit horizontaler Orientierung zusammen. Das <b>Header<\/b>-Element mit Bild und Text sehen Sie in Bild 4.<\/p>\n<p class=\"image\"><img decoding=\"async\" src=\"..\/fileadmin\/_temp_\/2021_04\/pic_281_004.png\" alt=\"GroupBox mit Bild im Header-Element\" width=\"424,6267\" height=\"218,7995\" \/><\/p>\n<div class=\"rcp_restricted\"><p><span style=\"color: #ff0000;\">M&ouml;chten Sie weiterlesen? Dann l&ouml;sen Sie Ihr Ticket!<\/span><br \/>\n<span style=\"color: #ff0000;\">Hier geht es zur Bestellung des Jahresabonnements des Magazins <strong>Visual Basic Entwickler<\/strong>:<\/span><br \/>\n<span style=\"color: #ff0000;\"><a style=\"color: #ff0000;\" href=\"https:\/\/shop.minhorst.com\/magazine\/363\/visual-basic-entwickler-jahresabonnement?c=77\">Zur Bestellung ...<\/a><\/span><br \/>\n<span style=\"color: #ff0000;\">Danach greifen Sie sofort auf <strong>alle rund 200 Artikel<\/strong> unseres Angebots zu - auch auf diesen hier!<\/span><br \/>\n<span style=\"color: #000000;\">Oder haben Sie bereits Zugangsdaten? Dann loggen Sie sich gleich hier ein:<\/span><\/p>\n<\/div>\n\n\t\n\t<form id=\"rcp_login_form\"  class=\"rcp_form\" method=\"POST\" action=\"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000281\/\">\n\n\t\t\n\t\t<fieldset class=\"rcp_login_data\">\n\t\t\t<p>\n\t\t\t\t<label for=\"rcp_user_login\">Username or Email<\/label>\n\t\t\t\t<input name=\"rcp_user_login\" id=\"rcp_user_login\" class=\"required\" type=\"text\"\/>\n\t\t\t<\/p>\n\t\t\t<p>\n\t\t\t\t<label for=\"rcp_user_pass\">Password<\/label>\n\t\t\t\t<input name=\"rcp_user_pass\" id=\"rcp_user_pass\" class=\"required\" type=\"password\"\/>\n\t\t\t<\/p>\n\t\t\t\t\t\t<p>\n\t\t\t\t<input type=\"checkbox\" name=\"rcp_user_remember\" id=\"rcp_user_remember\" value=\"1\"\/>\n\t\t\t\t<label for=\"rcp_user_remember\">Remember me<\/label>\n\t\t\t<\/p>\n\t\t\t<p class=\"rcp_lost_password\"><a href=\"\/data\/wp\/v2\/posts\/55000281?rcp_action=lostpassword\"><\/a><\/p>\n\t\t\t<p>\n\t\t\t\t<input type=\"hidden\" name=\"rcp_action\" value=\"login\"\/>\n\t\t\t\t<input type=\"hidden\" name=\"rcp_redirect\" value=\"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000281\/\"\/>\n\t\t\t\t<input type=\"hidden\" name=\"rcp_login_nonce\" value=\"58f932c395\"\/>\n\t\t\t\t<input id=\"rcp_login_submit\" class=\"rcp-button\" type=\"submit\" value=\"Login\"\/>\n\t\t\t<\/p>\n\t\t\t\t\t<\/fieldset>\n\n\t\t\n\t<\/form>\n<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Wer von Access kommt, hat vermutlich hier und da Optionsgruppen genutzt. Ein solches Steuerelement bietet WPF nicht direkt an. Allerdings gibt es Elemente, mit dem wir Optionsgruppen nachbauen k&ouml;nnen. Dabei handelt es sich um das GroupBox- und RadioButton-Steuerelement. Wie Sie damit Optionsgruppen mit Optionen nachbilden, zeigen wir in diesem Artikel.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"categories":[662021,66042021,44000027,44000015],"tags":[],"yst_prominent_words":[],"class_list":["post-55000281","post","type-post","status-publish","format-standard","hentry","category-662021","category-66042021","category-Excel_programmieren","category-WPFSteuerelemente"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000281","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/comments?post=55000281"}],"version-history":[{"count":0,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/posts\/55000281\/revisions"}],"wp:attachment":[{"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/media?parent=55000281"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/categories?post=55000281"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/tags?post=55000281"},{"taxonomy":"yst_prominent_words","embeddable":true,"href":"https:\/\/vbentwickler.de\/data\/wp\/v2\/yst_prominent_words?post=55000281"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}