RadWindow and WebBrowser

5 posts, 1 answers
  1. Andriy
    Andriy avatar
    7 posts
    Member since:
    Dec 2015

    Posted 04 Oct Link to this post

    Hello, I want to use WebBrowser in RadWindow. I know that I need to set AllowTransparency="False". With Fluent theme it works good but with Crystal theme it looks ugly. I tried to set CrystalPalette.Palette.CornerRadius = new CornerRadius(0) but there is still some border around window. How to make it fill all the window like in some other theme like Fluent?

  2. Vicky
    Admin
    Vicky avatar
    19 posts

    Posted 04 Oct Link to this post

    Hi,

    Setting CrystalPalette.Palette.CornerRadius = new CornerRadius(0) will be applied for all application controls that have the Crystal theme applied. In your scenario, there are two simple steps that need to be followed to achieve the desired appearance:

    • Setting the corner radius to 0 only for the RadWindow control using either the CornerRadius attached property of the MaterialClass or its new base class - ThemeHelper.
    • Removing the margin from the root grid named LayoutRoot either by extracting the default control template of the RadWindow and manually removing it, or finding this element in code-behind with ChildrenOfType and setting its Margin property to 0.

    I created a sample project for you that uses the Crystal theme with the NoXaml version of the assemblies. The project contains a Style that sets the RadWindow's corner radius property through the new ThemeHelper class and implements a method that removes the margin of the layout root grid in code-behind.

    Please, find the project attached to my reply, give it a try and let me know if it helps.

    Regards,
    Vicky
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Andriy
    Andriy avatar
    7 posts
    Member since:
    Dec 2015

    Posted 04 Oct in reply to Vicky Link to this post

    Thanks. It works. But there is also weird launch and resizing animation. Is there some way to make it like without transparency? Or maybe there is some way to make Browser work without turning off transparency.
  4. Andriy
    Andriy avatar
    7 posts
    Member since:
    Dec 2015

    Posted 06 Oct in reply to Andriy Link to this post

    When window starts there is white grid first and then it despairs. And can I set CornerRadius only for current window?
  5. Answer
    Vicky
    Admin
    Vicky avatar
    19 posts

    Posted 07 Oct Link to this post

    Hi Andriy,

    According to the following blog post - https://blogs.msdn.microsoft.com/changov/2009/01/19/webbrowser-control-on-transparent-wpf-window/, there is a "hacky" workaround to show a WebBrowser control as a child to a WPF Window. It states that a composition involving different rendering technologies supports transparency only with entire top-level windows, not child windows.

    The white grid that you mentioned is actually the empty WebBrowser control before its Source is loaded. I suggest wrapping the WebBrowser inside a BusyIndicator control like so:

     

    <telerik:RadWindow x:Class="Window_WPF_1432840.MainWindow"
                       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
                       xmlns:local="clr-namespace:Window_WPF_1432840"
                       xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                       xmlns:helpers="clr-namespace:Telerik.Windows.Controls.Theming.Helpers;assembly=Telerik.Windows.Controls"
                       xmlns:navigation="clr-namespace:Telerik.Windows.Controls.Navigation;assembly=Telerik.Windows.Controls.Navigation"
                       mc:Ignorable="d" Height="450" Width="800"
                       navigation:RadWindowInteropHelper.AllowTransparency="False"
                       Loaded="RadWindow_Loaded" WindowStartupLocation="CenterScreen"
                       helpers:ThemeHelper.CornerRadius="0">
        <telerik:RadWindow.Resources>
            <telerik:InvertedBooleanToVisibilityConverter x:Key="InvertedBooleanToVisibilityConverter"/>
        </telerik:RadWindow.Resources>
        <telerik:RadBusyIndicator x:Name="busyIndicator" IsBusy="True">
            <WebBrowser x:Name="browser" Source="http://www.telerik.com" LoadCompleted="browser_LoadCompleted" Visibility="{Binding ElementName=busyIndicator, Path=IsBusy, Converter={StaticResource InvertedBooleanToVisibilityConverter}}"/>
        </telerik:RadBusyIndicator>
    </telerik:RadWindow>

     

    I have modified the sample project from my previous reply. It now contains a BusyIndicator that is shown until the LoadCompleted event of the WebBrowser is fired. It also shows an empty RadWindow that now has the default corner radius for the Crystal theme (moved the helpers:ThemeHelper.CornerRadius="0" only where the first RadWindow with the browser is defined) .

    Please, find the updated version of the project attached, try it out and let me know if the result is the one that you are looking for.

    Regards,
    Vicky
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top