So I was have a combobox like below, coded like this;
AllowsTransparency="True" Background="Transparent">
<Border CornerRadius="10" Background="Beige" BorderBrush="Aqua" BorderThickness="2">
<Grid>
<StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
<Label Name="lblText"></Label>
<ComboBox Name="cbxNumbers"></ComboBox>
<TextBox Name="txtNumbers" Visibility="Collapsed"></TextBox>
<Button HorizontalAlignment="Center" Name="btnDone"
Click="btnDone_Click">That's Right!</Button>
</StackPanel>
<Button VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="1"
FontSize="8" Name="btnChangeInput" Click="btnChangeInput_Click">Let me chose the number
</Button>
</Grid>
</Border>
And then populated in code like this;
lblText.Content = Text;
cbxNumbers.Items.Add(5);
cbxNumbers.Items.Add(10);
cbxNumbers.Items.Add(50);
cbxNumbers.Items.Add(100);
cbxNumbers.Items.Add(1000);
cbxNumbers.Items.Add(10000);
cbxNumbers.Items.Add(100000);
cbxNumbers.Items.Add(1000000);
cbxNumbers.SelectedIndex = 0;
My question is obviously, why is my Dropdown showing beneath my window?
UPDATE
Quote Microsoft
Thank you for reporting this issue. Though this issue is under
investigation, we will likely not have a fix available in .NET 4.0. We
will update this bug again when we are able to fix the issue in a
future release. Thanks!
Great... any ideas for a work around?
This is a well documented bug with AllowTransparency=TRUE. It only happens on some computers running Win XP.
http://connect.microsoft.com/VisualStudio/feedback/details/465964/wpf-combobox-dropdown-list-appears-behind-the-form-when-allowstransparency-true
A workaround is found here:
As noted before, this is an issue with layered windows on XP. There is
not much that can be done at the WPF level to solve this, and given
that XP is no longer being serviced this isn't very likely to be
fixed. There are potentially workarounds you can employ, though.
The source of the problem is that WPF uses something called "Layered
Windows" when WindowStyle=None and AllowsTransparency=True. Often the
reason for doing this is to implement custom window chrome. Recently
the WPF team published a library that allows you to get custom chrome
without resorting to layered windows. The library is available at
http://code.msdn.microsoft.com/WPFShell
This doesn't support per-pixel opacity, but it does allow for
completely custom rendering of the window, including areas normally
managed by the system. It lets you set the radii of the windows
corners, but not have a completely arbitrary shape. If you can use
this library instead of AllowsTransparency=True then it should solve
this issue.
Microsoft has issued a hotfix, but it seems to not have fixed all problems related to the issue.
Related
Problem:
After updating a few WPF projects in C# using Visual Studio to a higher target framework such as .NET 4.7, I noticed that wherever I used a Border.Clip in my xaml code, it would "mask" and hide everything in the design preview. All compiles and runs just fine but when working on the code in XAML, it is hard to see any visual feedback with code changes since the clip "masks" everything when before in older .NET frameworks, I never had this issue. Can someone explain why this is happening and what a solution may be?
Here is an example of what I see in a xaml file when I add a Border.Clip (Again, a complied version will show the real elements, it only appears this way in the preview in Visual Studio)
Border.Clip
`
<Border.Clip>
<RectangleGeometry RadiusX="10" RadiusY="10">
<RectangleGeometry.Rect>
...Some binding for dimensions.
</RectangleGeometry.Rect>
</RectangleGeometry>
</Border.Clip>
`
Omitting this code, will reveal all UI elements in the preview.
Again, the code is correct and does its job on runtime. With that said, I've tried both omitting and being super specific about any radius, shape, or dimensions of the clip and both still "mask" the preview.
For example just adding this line of code, masks everything.
`
<Border.Clip>
</Border.Clip>
`
As you could see I didn't have your problem.
My test environment is in VS 2022 Community 17.4.1 .Net Framework 4.8.
Maybe there is a little problem with your usage, please refer to the following documents.
My demo code:
<Grid>
<Canvas>
<Image Source="Your path" Height="150" Canvas.Left="148" Canvas.Top="67">
<Image.Clip>
<RectangleGeometry Rect="100 75 50 50"/>
</Image.Clip>
</Image>
<Border Background="Chocolate" BorderBrush="Black" BorderThickness="3" Width="300" Height="250" Canvas.Left="387" Canvas.Top="67">
<Border.Clip>
<RectangleGeometry Rect="100 75 50 50"/>
</Border.Clip>
</Border>
</Canvas>
</Grid>
Is there any technique to render the images more clearly in MAUI, like RenderOption in WPF.
My image must be like this:
and it is rendered like this:
Edit: This project will run only on Windows Desktop and MacCatalyst. This behavior is happening on Windows device.
The OS is Windows 11 x64
Image xaml:
<Border
Grid.Row="1"
Margin="3"
HeightRequest="140"
StrokeShape="RoundRectangle 1,1,1,1"
WidthRequest="140">
<Border.Stroke>Black</Border.Stroke>
<Border.StrokeThickness>0.3</Border.StrokeThickness>
<Image
Margin="1"
Aspect="AspectFill"
Background="{StaticResource Gray100}"
HeightRequest="130"
HorizontalOptions="Center"
Source="{Binding MyImage}"
VerticalOptions="Center"
WidthRequest="130" />
</Border>
In action:
As a summary, I will post an answer so that it will help others who have similar problems. Thanks for your support and feedback #ValiMatie.
The posted issue is here: https://github.com/dotnet/maui/issues/10916 .
And it has been moved to Backlog milestone. This means that it is not going to be worked on for the coming release.
I have a user control LoadingIndicatorControl which is displayed in various other controls when loading is happened.
This user control is very simple and looks like this:
<StackPanel HorizontalAlignment="Stretch"
Visibility="{Binding Loading, Converter={StaticResource Bool2Vis}}">
<Image x:Name="imgLoadingSpinner"
gif:ImageBehavior.AnimatedSource="pack://application:,,,/Images/Loading_Spinner.gif"
HorizontalAlignment="Right"
Width="30"
Height="30" />
</StackPanel>
I nest it in other views like this:
<uc:LoadingIndicatorControl Loading="{Binding Loading}"
DockPanel.Dock="Bottom"/>
When I run this application it compiles without issues and the loading indicator is displayed as I expect.
However at design time only I'm getting errors about this user control, related to the image resource. This gif is set to Build Action Resource.
In my host view I get this:
And if I look at the detail of why, it says Cannot locate resource 'images/loading_spinner.gif':
If I look at LoadingIndicatorControl in design view it does in fact locate the loading_spinner.gif resource and gives no errors.
What I have tried:
Clean and rebuild numerous times
Close VS2019 and reopen
Clean, close VS, reopen and rebuild
Set Loading_Spinner.gif Build Action to Embedded Resource (was Resource which also works at runtime)
Tried platform targets Any CPU, x64, x86
Interestingly, setting to build configuration to Release does prevent the error from appearing! It only appears when Debug is used.
I'm using Visual Studio Professional v16.11.16.
Any ideas how I can fix this?
Just use the direct path to the image:
<Image gif:ImageBehavior.AnimatedSource="Images/Loading_Spinner.gif"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Width="30"
Height="30" />
If you really need the pack URI, the format is explained here, it look like this:
<Image gif:ImageBehavior.AnimatedSource="pack://application:,,,/SO_72648958;component/Images/Loading_Spinner.gif"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Width="30"
Height="30" />
Working demo here.
I wrote a WPF C# application and every element of front end is adjusted in margins, for example:
<TabItem x:Name="ClipboardItem" FontSize="15" FontFamily="Century Gothic" Height="60" Header="
Multi Clipboard" Background="#2a2a29" Foreground="#e7e8ea" Margin="-4,-7,-57,8">
On my computer, everything looks good and just how i wanted. Weird thing is about other PCs. For example on other PC2 element let's call it A looks diffrent and run over but on other PC3 element A looks exactly like on my PC but other element B looks totally diffrent. To the point, on other PCs some elements are just like they should be, but some elements are not. It's window application with rigidly set height and length. Could you tell me how to fix that?
First of all. computers can come in many different resolutions and aspect ratios. so if you want to fit them all. use GridView or a ViewBox (there's more but these are good for starters). and it's not recommended to use margins for most elements unless it's small and in a corner then again don't use that.
use something suitable instead of HorizontalAlignment="Stretch"
<GridView HorizontalAlignment="Stretch" >
<TabItem x:Name="ClipboardItem" FontSize="15" FontFamily="Century Gothic"
Height="60" Header=" Multi Clipboard" Background="#2a2a29"
Foreground="#e7e8ea">
</GridView>
Learn about Grid Views before you try this code https://learn.microsoft.com/en-us/dotnet/desktop/wpf/controls/gridview-overview?view=netframeworkdesktop-4.8
if you want to maintain the aspect ratio Use View Box:
https://stackoverflow.com/a/290229/10518289
One other thing to keep in mind that all computers you test on must run the same version of .Net Framwork or the latest.
I'm using Visual Studio 2010 & Expression Blend 4, the target is Windows Phone 7 platform.
What I would like to make is a custom control (specifically a custom PushPin for Map, but could be anything) and expose some of it's properties so I could change them. I'll try to explain better with an example:
<ControlTemplate x:Key="PushpinControlTemplate1" TargetType="Microsoft_Phone_Controls_Maps:Pushpin">
<Border BorderBrush="#FF0012AD" BorderThickness="3" Background="#FF0012AD" Width="32" Height="32" CornerRadius="5">
<TextBlock Text="2" FontWeight="Bold" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="32" Margin="0,-4,0,0"/>
</Border>
</ControlTemplate>
This example is from MSDN example.
Now, when I "use" this template on a map, it shows as expected, but with one problem. I would like that the Text property of the TextBlock (in this case... for example it could be ImageSource if I put an image into the PushPin) could be changed in the properties panel of Expression Blend, and in the C# code "behind" the XAML - of course, for each "instance" of this PushPin separately.
As far as I know, it has to do something with Dependency properties (I could be wrong?), but I am yet to find a clear example showing exactly WHAT, WHERE (C# / XAML) and WHY (sorry, I had to emphasize) had to be done.
I grasped most of the Phone 7 "topics" but now I'm a little stuck regarding resources and data bindings, as shown here :)
If someone could provide some sample code or a link to a good tutorial I would be grateful. Thanks!
If you want to simply set a user control property by code, you can use a normal property. If however you want to bind to the property, you must use a dependency property.
Good example here