Page 1 of 2

Programatically set a buttons image

Posted: 13 Apr 2022, 11:16
by dazza
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?

Re: Programatically set a buttons image

Posted: 13 Apr 2022, 17:46
by sfernandez
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):


Re: Programatically set a buttons image

Posted: 13 Apr 2022, 18:52
by dazza
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>

Re: Programatically set a buttons image

Posted: 15 Apr 2022, 01:46
by sfernandez
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?

Re: Programatically set a buttons image

Posted: 29 Apr 2022, 11:25
by dazza
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)

Re: Programatically set a buttons image

Posted: 29 Apr 2022, 20:43
by sfernandez
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>

Re: Programatically set a buttons image

Posted: 02 May 2022, 12:33
by dazza
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

Re: Programatically set a buttons image

Posted: 02 May 2022, 13:21
by sfernandez
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.

Re: Programatically set a buttons image

Posted: 02 May 2022, 14:41
by dazza
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).

Re: Programatically set a buttons image

Posted: 03 May 2022, 12:16
by dazza
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?