dazza
Topic Author
Posts: 14
Joined: 10 Jan 2022, 20:41

Programatically set a buttons image

13 Apr 2022, 11:16

I have a StackPanel in to which I want to add/remove buttons that are essentially images. I create and add the button and that works but the button content (the image) is not rendered.

I have tried setting various properties (see commented out code) but alas the image does not appear. I've checked the images are loaded and in the GUI Inspector the image is a child of the
            auto button = MakePtr<Button>();
            button->SetName(spec.name.c_str());
            if(spec.iconPath.length())
            {
                auto image = new Noesis::Image();
                image->SetSource(new BitmapImage(spec.iconPath.c_str()));
                //image->SetHorizontalAlignment(Noesis::HorizontalAlignment_Center);
                //image->SetVerticalAlignment(Noesis::VerticalAlignment_Center);
                //image->SetStretch(Noesis::Stretch_Fill);
                //image->SetWidth(100);
                //image->SetHeight(100);
                button->SetContent(image);
            }
            stack->GetChildren()->Add(button);
Any ideas?
 
User avatar
sfernandez
Site Admin
Posts: 2536
Joined: 22 Dec 2011, 19:20

Re: Programatically set a buttons image

13 Apr 2022, 17:46

Are you using your own style and template for the Button? In order to render the Content property in a content control like a button, the template must include a ContentPresenter.

The following xaml reproduces the same code you posted (just added the explicit template as a reference):

 
dazza
Topic Author
Posts: 14
Joined: 10 Jan 2022, 20:41

Re: Programatically set a buttons image

13 Apr 2022, 18:52

I was not using a style, so I added the Control template and now the images appear in the buttons, however if I set the width of the ContentPresenter (in xaml) or the Buttons (in C++) the image does not appear.
<StackPanel x:Name="ENG_Planets" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
    <StackPanel.Resources>
        <ControlTemplate x:Key="buttonTemplate" TargetType="Button">
            <ContentPresenter/>
        </ControlTemplate>
    </StackPanel.Resources>
    <!-- buttons inserted here in code -->
</StackPanel>
 
User avatar
sfernandez
Site Admin
Posts: 2536
Joined: 22 Dec 2011, 19:20

Re: Programatically set a buttons image

15 Apr 2022, 01:46

I changed previous xamltoy to stack elements horizontally, set the Button's Width, and the content Image is correctly rendered.

Could you check in the Inspector tool what are the values of the ActualWidth/ActualHeight of the Image and ContentPresenter of the button?
 
dazza
Topic Author
Posts: 14
Joined: 10 Jan 2022, 20:41

Re: Programatically set a buttons image

29 Apr 2022, 11:25

Both the ContentPresenter and the Image have:

ActualWidth=64
ActualHeight=64

This is the size I am setting in C++ for the image. I know the images are loading correctly because if I don't force the size to 64 the images appear (but massive).

(sorry for the delay in replying)
 
User avatar
sfernandez
Site Admin
Posts: 2536
Joined: 22 Dec 2011, 19:20

Re: Programatically set a buttons image

29 Apr 2022, 20:43

I might be missing something obvious, because that is a very simple scenario that should work (and is working on all my tests).

Perhaps it is a problem with the integration layer and the stencil buffer.
In the inspector top toolbar you can enable the Overdraw debug flag, could you toggle that to see if the Button is rendering the Image activating any stencil (a blue rectangle)?

If that is the case, please try with the following xaml in your game and let me know what you see (it should be a 200x200 red rectangle):
<Grid
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Border Width="200" Height="200">
    <Rectangle Width="300" Height="300" Fill="Red"/>
  </Border>
</Grid>
 
dazza
Topic Author
Posts: 14
Joined: 10 Jan 2022, 20:41

Re: Programatically set a buttons image

02 May 2022, 12:33

We are integrating Noesis in to a relatively old OpenGL engine so the integration is definitely a candidate.

When I enable Overdraw I do not see any blue on the elements in question (although I so see it in other places). I see green squares.

Image
 
User avatar
sfernandez
Site Admin
Posts: 2536
Joined: 22 Dec 2011, 19:20

Re: Programatically set a buttons image

02 May 2022, 13:21

Could you please save a RenderDoc capture of a frame where the images are not rendered and share it with us for analyze?
If you can keep the scene to the minimal number of elements it would be easier.
 
dazza
Topic Author
Posts: 14
Joined: 10 Jan 2022, 20:41

Re: Programatically set a buttons image

02 May 2022, 14:41

Alas, RenderDoc does not run with this codebase. The current UI tech the codebase uses crashes and we are not able to work around that (until it is replaced by Noesis).
 
dazza
Topic Author
Posts: 14
Joined: 10 Jan 2022, 20:41

Re: Programatically set a buttons image

03 May 2022, 12:16

Since this is proving to be a real PITA to debug I have resized the source png files to 64x64 and now they appear as expected. I suggest we close this issue and pick it up again when I can run RenderDoc and dig further. Agree?

Who is online

Users browsing this forum: Ahrefs [Bot], Semrush [Bot] and 3 guests