{"id":4662,"date":"2022-04-15T08:43:29","date_gmt":"2022-04-15T06:43:29","guid":{"rendered":"https:\/\/ekiwi.de\/index.php\/4662\/c-xaml-position-eines-usercontrols-ermitteln\/"},"modified":"2022-12-10T21:56:22","modified_gmt":"2022-12-10T20:56:22","slug":"c-get-position-of-usercontrol","status":"publish","type":"post","link":"https:\/\/ekiwi.de\/en\/index.php\/4662\/c-get-position-of-usercontrol\/","title":{"rendered":"C#\/XAML: Get location of UserControl"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_82_2 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of content<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/ekiwi.de\/en\/index.php\/4662\/c-get-position-of-usercontrol\/#WindowStartupLocation_CenterOwner_does_not_work\" >WindowStartupLocation CenterOwner does not work<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/ekiwi.de\/en\/index.php\/4662\/c-get-position-of-usercontrol\/#Align_dialogwindow_to_position_of_a_UserControl\" >Align dialog\/window to position of a UserControl<\/a><\/li><\/ul><\/nav><\/div>\n<p>UserControls are relatively practical due to their multiple usability. If you create more complex user controls in C#\/<a title=\"binding several properties to one element with MultiBinding\" href=\"https:\/\/ekiwi-blog.de\/en\/25911\/binding-multiple-properties-with-xaml-c\/\" target=\"_blank\" rel=\"noopener\">XAML<\/a>, e.g. with Visual Studio, and call further dialogs\/Windows from the UserControl, then these dialogs or Windows appear somewhere on the screen.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-2577 size-full\" src=\"\/wp-content\/uploads\/2022\/04\/window-dialog-to-usercontrol-position.jpg\" alt=\"Screenshot called window is displayed somewhere on screen\" width=\"701\" height=\"273\" srcset=\"\/wp-content\/uploads\/2022\/04\/window-dialog-to-usercontrol-position.jpg 701w, \/wp-content\/uploads\/2022\/04\/window-dialog-to-usercontrol-position-300x117.jpg 300w\" sizes=\"auto, (max-width: 701px) 100vw, 701px\" \/><\/p>\n<h2><span class=\"ez-toc-section\" id=\"WindowStartupLocation_CenterOwner_does_not_work\"><\/span>WindowStartupLocation CenterOwner does not work<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>In order for a dialog to appear within the program interface as much as possible, you can use the following code, which centers the called dialog over the element from which it was called. It is important that the <em>Owner<\/em> property is set before the call.<\/p>\n<p><code>this.WindowStartupLocation = WindowStartupLocation.CenterOwner;<\/code><\/p>\n<p>The only problem is that WindowStartupLocation does <a href=\"https:\/\/ekiwi-blog.de\/17842\/windows-11-drag-drop-auf-taskbar-funktioniert-nicht\/\">not work<\/a> in the context of a user control.<\/p>\n<p><code>dialog.Owner = MyUserControl;<\/code><\/p>\n<p>This throws an error:<\/p>\n<blockquote><p>Cannot implicitly convert type &#8216;UserControlType&#8217; to &#8216;System.Windows.Window&#8217;<\/p><\/blockquote>\n<p>The reason is that the UserControl itself cannot be the <em>Owner<\/em>, because due to its multiple use it is only one element within a window\/dialog. This means that you would have to determine the <em>Parent <\/em>window of the user control.<\/p>\n<p><code>UserControl.Parent as Window<\/code><\/p>\n<p>Since a UserControl can be an element of another UserControl and this can also be an element of another UserControl, you would have to try to determine the parent via a loop, otherwise this procedure also fails.<\/p>\n<h2><span class=\"ez-toc-section\" id=\"Align_dialogwindow_to_position_of_a_UserControl\"><\/span>Align dialog\/window to position of a UserControl<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>To align a dialog\/window, which is called by a user control, with the user control, I use the following code to determine the location on the screen. This is then passed to the dialog\/window.<\/p>\n<p><code>MyDialog dialog = new (MyParameter);<br \/>\nPoint p = MyUserControl.PointToScreen(new Point(0, 0));<br \/>\ndialog.Top = p.Y;<br \/>\ndialog.Left = p.X;<br \/>\ndialog.ShowDialog();<\/code><\/p>\n<p>&#8220;<em>MyUserControl<\/em>&#8221; can also be replaced by a specific element on the UserControl, e.g. a button. Then the dialog will be aligned exactly to this button.<\/p>\n<figure id=\"attachment_2578\" aria-describedby=\"caption-attachment-2578\" style=\"width: 701px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-2578 size-full\" src=\"\/wp-content\/uploads\/2022\/04\/position-window-dialog-to-usercontrol.jpg\" alt=\"Screenshot dialog has the position\/location of the UserControl\" width=\"701\" height=\"240\" srcset=\"\/wp-content\/uploads\/2022\/04\/position-window-dialog-to-usercontrol.jpg 701w, \/wp-content\/uploads\/2022\/04\/position-window-dialog-to-usercontrol-300x103.jpg 300w\" sizes=\"auto, (max-width: 701px) 100vw, 701px\" \/><figcaption id=\"caption-attachment-2578\" class=\"wp-caption-text\">Dialog is called at the location of the UserControl<\/figcaption><\/figure>","protected":false},"excerpt":{"rendered":"<p>UserControls are relatively practical due to their multiple usability. If you create more complex user controls in C#\/XAML, e.g. with<\/p>\n","protected":false},"author":2,"featured_media":3616,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[870],"tags":[872,892,876,890,891,889,875,887],"class_list":["post-4662","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-programming","tag-c-en","tag-gui","tag-programming-en","tag-user-control","tag-user-interface","tag-usercontrol","tag-visual-studio-en","tag-xaml-en"],"_links":{"self":[{"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/posts\/4662","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/comments?post=4662"}],"version-history":[{"count":0,"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/posts\/4662\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/media\/3616"}],"wp:attachment":[{"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/media?parent=4662"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/categories?post=4662"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ekiwi.de\/en\/index.php\/wp-json\/wp\/v2\/tags?post=4662"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}