hiding appbar on overlay progress bar - c#

I am working a windows phone 7 application.Now in this application on specific user input i show overlay progress bar from coding4fun Silverlight toolkit.
But App bar on that page on which i am showing overlay progress bar remains active.
I want to make it generic that when ever I call overlay
progress bar.show()
App bar should be hidden.

You can use the BindableApplicationBar from the Phone7Fx library here :-
http://phone7.codeplex.com/
You can then bind the IsVisible property of the BindableApplicationBar to the Visibility property of the ProgressOverlay, using XAML as follows :-
<phone7fx:BindableApplicationBar x:Name="AppBar"
BarOpacity="1"
IsVisible="{Binding Path=Visibility, ElementName=MyProgressOverlay, Mode=TwoWay, Converter={StaticResource VisibilityToBooleanConverter}}" />
Then if you call the Show or Hide method against the ProgressOverlay then the Application Bar will Appear and Disappear accordingly.
Bear in mind that you define the Phone7.Fx BindableApplicationBar within the last Grid tag and not before the last phone:PhoneApplicationPage.

Related

WPF custom title bar with Windows 11 caption buttons

To edit non client area, I need to create my own title bar in my WPF app setting WindowStyle to none and non resizable. I have created my own caption button but it don't get the feel of Windows 11. When we hover mouse over middle button we can see a window snap option as seen in this image
Is there anyway to achieve this, I mean there should be, I even tried many nuget packages having custom Window, but I didn't got what I wanted.
All I want is to get a Window with System's default Window behavior but can have a Sliding panel from left which is even over title bar, somewhat like this but I dont want to make title bar myself I want systems default.
Even if its custom made I want it perfectly same as System's Default Window
Its already in many Windows apps :- Clock ,Mail, Even Word .
In each of this apps left panel is over title bar and even preserving the system's default window behavior, Please Please Please tell me I have been looking for it from 2 months.
Nuget Package I tried : https://github.com/Kinnara/ModernWpf
code I tried:
<Window '''''default code ''''
''''''''''''''''''''''
''''''''''''''''''''''
''''''''''''''''''''''
WindowStyle="None"
ResizeMode="NoResize">
<!--This created blank window with no title bar-->
<Grid>
<!--creating title bar-->
<Grid ''''' code so grid appear as title bar on top
and we can drag too>
<!--caption buttons-->
<button ''''button with '-' and style as
windows caption button and minizimes window
when clicked'''''''''''/>
<button ''''button with 'square symbol' and style as
windows caption button and maximize or restore window
when clicked'''''''''''/>
<button ''''button with 'close symbol' and style as
windows caption button and close window
when clicked'''''''''''/>
</Grid>
<!---
rest of the code
""""""""""""""""""
"""""""""""""""
""""""""""""""""--->
</Grid>
<Window/>

How to display progress bar on top of the web browser in a popup?

I have a web browser and progress bar in a parent popup control. When the application is not running, in the design view the progress bar is being shown on top of the web browser, but as soon as the application runs the progress bar goes behind web browser. I have tried using the ZIndex also, but in vain.
Please help me with this because I have this requirement that when the content is being loaded in web browser, the progress bar should be shown at the top of blank web browser.
Code is something of this sort:
<Grid>
<Popup
IsOpen="True"
StaysOpen="True"
Placement="Center"
Height="100"
Width="200">
<Border>
<Grid>
<WebBrowser
Grid.ZIndex="1"
Visibility="Visible"
Margin="10"
Source="D:\Temp\gui1_Help.html">
</WebBrowser>
<ProgressBar
Grid.ZIndex="2"
Height="50"
Visibility="Visible"
IsIndeterminate="True"
>
</ProgressBar>
</Grid>
</Border>
</Popup>
</Grid>
This image shows progress bar on top of web browser (When the application is not running):
This image shows progress bar goes behind web browser (When the application is running):
Unfortunately, the WPF WebBrowser control is actually just a wrapped version of the WinForms control.
See: Make WPF control over the web browser
See: Is there a way to render WPF controls on top of the wpf WebBrowser control?
And due to the rendering order of WPF, WinForms will always be rendered on top of WPF controls.
You have two options:
Go with a 3rd party WPF control (to avoid WinForms altogether), such as CESSharp.
Place your progress bar inside of a new Window that has WindowStyle=None and sized to just the progress bar, and place it on top of your browser. The huge downside to this is maintaining the window position if your browser or main window is resized.

WPF Extended Toolkit BusyIndicator Text is cutoff

When I use the WPF Extended Toolkit BusyIndicator in any other application, I have no problems. Using it in my current application, the text is cut off. I have been playing around with the properties on the BusyIndicator. Here is the xaml:
<xctk:BusyIndicator IsBusy="True" Panel.ZIndex="1000"/>
I wanted to post a picture so you could see what it looks like. The "Please Wait..." text is too low and the bar is laying on top of it. Has anyone experienced this before? I am stumped on what to do. I can't figure out how to change the height of the content inside the box, if that is even the issue.
Edit:
It currently displays as the following:
But I want it to display without the text being covered:
The designer displays it how I want it to display but the application, while running, displays it as shown in image one.
I think that your problem is that you have changed the default textblock size. But you can also fix with the BusyContentTemplate
For example I make the text bigger and red:
<xctk:BusyIndicator IsBusy="True" Panel.ZIndex="1000" >
<xctk:BusyIndicator.BusyContentTemplate>
<DataTemplate>
<TextBlock Foreground="Red" FontSize="15">Please Wait</TextBlock>
</DataTemplate>
</xctk:BusyIndicator.BusyContentTemplate>
</xctk:BusyIndicator>
You can also change the textblock for whatever you want.
I hope this can help you.
I discovered the issue. The underlying datatypes in the WPF Extended Toolkit's BusyIndicator is a grid. One of the grid's properties were being set in a global style file that I was unaware of...

Disable scrolling phone:webbrowser windows phone 8 / 8.1

I am trying to disable the scroll functionality in the phone:webbrowser in my windows phone 8 application. The reason i wan't to do this is that I want to place a stackpanel with items underneath the webview, but still show the whole webpage.
To accomplish this I get the total height of the webpage and set the height of the webbrowser to the webpage height. This will be done through adding javascript to the webbrowser. The webview will now have the total webpage and the items underneath it and both of those items are in a ScrollViewer so you can scroll through the page.
The only problem i have right now is that you can scroll the webbrowser so you cant scroll the scrollviewer. anyone got an idea how to fix this?
<ScrollViewer
Grid.Row="1"
Margin="0,0,0,0">
<StackPanel
x:Name="ContentPanel"
Margin="0,0,0,0">
<phone:WebBrowser
x:Name="webView"
Navigating="WebBrowserNavigating"
LoadCompleted="WebBrowserLoadCompleted"
ScriptNotify="browser_ScriptNotify"
IsScriptEnabled="True"/>
<StackPanel
x:Name="CouponHolder"
Margin="0,5,0,0">
</StackPanel>
</StackPanel>
</ScrollViewer>
I also looked at other questions, but they didnt work out for me:
http://www.codeproject.com/Tips/718671/Disable-WebView-scrolling-in-Windows-Store-Apps
And I see allot of people give awnsers like VerticalScrollBarVisibility="Disabled" but this doesnt work, like the suggests it will only hide the visibility...
you can disable all manipulation with WebBrowser control by setting IsHitTestVisible="false". The disadvantage is that you can't press Links, Navigate and so on.
If you want just to disable scrolling than take a look at this blog post:http://www.scottlogic.com/blog/2011/11/17/suppressing-zoom-and-scroll-interactions-in-the-windows-phone-7-browser-control.html
You can Find that the VisualTree of WebBrowser control looks like:
\-WebBrowser
\-Border
\-Border
\WebBrowserInteropCanvas (New in Windows Phone 8, missing in WP7)
\-PanZoomContainer
\-Grid
\-Border (you need access this one)
\-ContentPresenter
\-TileHost
You can get the last Border in VisualTree, and subscribe to ManipulationDelta, ManipulationStarted and ManipulationCompletedEvents. And set e.Handled = true; In event handlers. Be careful with that. For example where is no equialent for this code in Windows 8.1 and Windows Phone 8.1 (Runtime).
This hack will cancel scrolling of webbrowser while user can interract with entire web page, but you won't be able to suppress manipulation to put webbrowser in scrollviewer.
In general I don't think that you could achive ideal user experience if you put WebBrowser inside ScrollViewer
After hours of searching this project finally solved all our webview problems in Windows Phone 8.1 (bounce, touch, auto height etc.):
https://github.com/romshiri/sizeable-webview

Visibility of ViewBox set from code

On my Window, I have a ViewBox control, which contains a custom progress bar. I set its Visibility to Collapsed in design mode, because I need to display it in only certain moment (during login into app).
In my progress bar, which is usercontrol, I have event handler for VisibilityChanged event where I stop and start my animation.
When user clicks on the Login button, I need to show this ViewBox until Login is completed and collapse it again after success. But, when I (in code behind) set ViewBox.Visibility = Visible, it doesn't show up.
Can anybody tell me why, or how to fix it ?
XAML:
<Viewbox x:Name="cpProgress" Width="50" Height="50" HorizontalAlignment="Center" VerticalAlignment="Bottom" Grid.Row="1" Visibility="Collapsed" >
<lc:CircularProgress />
</Viewbox>
Thanks
change ViewBox.Visibility = Visible to cpProgress.Visibility = Visible and ensure that the Grid has a proper row height defined for row 1.
I've finally come to solution of this problem. It is really simple :).
I've just forgot that If I run the login process in same thread, as my window is in, the UI will hang until the login is completed. So solution is to spawn a new thread,run the login in its context and wait for completed flag to be set in UI's thread. The login process has to be running in asynchronous manner, so the UI could draw my usercontrol.

Categories

Resources