Roest
Topic Author
Posts: 28
Joined: 15 Jan 2020, 15:30

Some pre beginning questions

15 Jan 2020, 16:11

I'm developing my game for almost 3 years now in Qt5. A decision I made back then because I had a lot of experience with Qt but came to regret over the years as Qt Widgets is not the best choice for game UIs. Now I'm in the process of deciding a new GUI framework. My game uses a QOpenGLWidget with QOpenGLFunctions_4_2_Core. The rendering is pure OpenGL. So naturally I'm looking for a framework that would allow me to keep the existing OpenGl renderer and add the GUI rendering on top of it or provide the creation of an OpenGL 4.2 context and let me add my game rendering.

What is needed as a dependency? Skimming over the examples I see GLUT. Is that mandatory?

is it possible for Noesis to use the Qt OpenGL context?
 
User avatar
jsantos
Site Admin
Posts: 2906
Joined: 20 Jan 2012, 17:18
Contact:

Re: Some pre beginning questions

15 Jan 2020, 17:28

What is needed as a dependency? Skimming over the examples I see GLUT. Is that mandatory?
No dependencies at all. GLUT is used to showcase a minimal app using Noesis. Core just need a valid implementation of a RenderDevice. Although we provide a few reference implementations you can create your own one. Our GLRenderDevice reference implementation just use the active render context, so I assume this should be compatible with Qt OpenGL.
 
Roest
Topic Author
Posts: 28
Joined: 15 Jan 2020, 15:30

Re: Some pre beginning questions

16 Jan 2020, 10:52

Thanks for the answer. I managed to modify the integration example to render on a Qt opengl widget over some other stuff. So that works. Another thing that is pretty important and I can't seem to find in the docs here is how does scaling work? Is it possible to apply some arbitrary scaling multiplier to the entire gui?
 
User avatar
jsantos
Site Admin
Posts: 2906
Joined: 20 Jan 2012, 17:18
Contact:

Re: Some pre beginning questions

16 Jan 2020, 15:06

All elements can be scaled, including the root. There is also a specific control that helps to create resolution independent interfaces: ViewBox
 
Roest
Topic Author
Posts: 28
Joined: 15 Jan 2020, 15:30

Re: Some pre beginning questions

16 Jan 2020, 16:47

Ok last question then I'm gone, promise. :) All the examples I've seen are more less static full screen elements. I have lots of small windows for various elements that are created on demand, the user can arrange them like they want and they can overlap. Example: Would that be possible here?
 
User avatar
jsantos
Site Admin
Posts: 2906
Joined: 20 Jan 2012, 17:18
Contact:

Re: Some pre beginning questions

16 Jan 2020, 17:01

Yes, of course, that can be done. We recommend having a single view covering all the screen and then adding elements on demand, like floating windows. For examples, in Sansar Avatar Editor they are using NoesisGUI for things like that:

Image

Please, ask everything you need. 😃
 
User avatar
jsantos
Site Admin
Posts: 2906
Joined: 20 Jan 2012, 17:18
Contact:

Re: Some pre beginning questions

17 Jan 2020, 22:19

😃 I was going to answer... You can use a container like a Grid as a root, then use Children.Add(), Children.Remove() to add controls. Having the same View is more efficient and also input events are easier to handle.

Menu3D is a good example for this, although instead of dynamically adding children, the visibility of each panel is being changed.
 
User avatar
jsantos
Site Admin
Posts: 2906
Joined: 20 Jan 2012, 17:18
Contact:

Re: Some pre beginning questions

17 Jan 2020, 22:19

Anyway, marking this as solved.
 
Roest
Topic Author
Posts: 28
Joined: 15 Jan 2020, 15:30

Re: Some pre beginning questions

19 Jan 2020, 16:39

This has been a very frustrating weekend so far. As nice as your samples are, in fact if I had something like the Menu3D in my game I would be very happy, they are just not a good learning resource as they are simply too complex for that. Of course I'm new to xaml so some heavy learning is expected but the general concept is straightforward enough that someone with 30 years programming experience should be able to get simple results pretty quickly.

As I mentioned I'm using it with Qt5 in a QOpenGLWindow so I can't really use the app framework but will integrate it into my own. So first step was to create that window, initialize my GL stuff then initialize Noesis and render some hello world. That works, though there is still some strange thing going on that my rendering fails with
 glEnable( GL_DEPTH_TEST );
even though I call
glClear( GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT );
before. But lets ignore that for now.

The plan is to start with the menu stuff, main menu, settings screens, new game screens and so on. Using the Menu3D example I just remove stuff and just keep your headers, change it to my namespace and created the main menu page.
<Page
	x:Class="MainMenu"
    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" mc:Ignorable="d"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    xmlns:noesis="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions"
	xmlns:local="using:IngnomiaGUI"
    
    x:Name="MainMenuControl">

    <Border Margin="20">
        <Viewbox>
            <Grid Width="960" Height="540">
                <Grid.Background>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Offset="0" Color="#FF123F61"/>
                        <GradientStop Offset="0.6" Color="#FF0E4B79"/>
                        <GradientStop Offset="0.7" Color="#FF106097"/>
                    </LinearGradientBrush>
                </Grid.Background>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="2*"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="1" FontSize="50" HorizontalAlignment="Center" VerticalAlignment="Center" Text="Ingnomia" />
                <local:MainPage x:Name="MainPage" Grid.Row="1" Grid.Column="1"/>
                <local:SettingsPage x:Name="SettingsPage" Grid.Row="1" Grid.Column="1" Visibility="Hidden"/>
            </Grid>
        </Viewbox>
    </Border>
    
</Page>
With the main page just some buttons
<UserControl
    x:Class="MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:IngnomiaGUI"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
	xmlns:noesis="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions">
	
	
    <UserControl.Resources>
        <ResourceDictionary Source="MMStyles.xaml"/>
    </UserControl.Resources>
    <StackPanel>
        <ToggleButton x:Name="MMContinue"  Style="{StaticResource MenuButtonStyle}" Content="Continue"/>
        <ToggleButton x:Name="Start"       Style="{StaticResource MenuButtonStyle}" Content="New Game" />
        <ToggleButton x:Name="MMSetupGame" Style="{StaticResource MenuButtonStyle}" Content="Setup Game"/>
        <ToggleButton x:Name="MMLoadGame"  Style="{StaticResource MenuButtonStyle}" Content="Load Game"/>
        <ToggleButton x:Name="Settings"    Style="{StaticResource MenuButtonStyle}" Content="Settings" Command="{Binding Settings}"/>
        <ToggleButton x:Name="Exit"        Style="{StaticResource MenuButtonStyle}" Content="Exit" Click="onMMExit_Click"/>
        <TextBlock x:Name="MenuDescription"/>
		<Grid Margin="18,4,0,0">
			<ContentControl Content="Dive straight into the adventure." IsEnabled="{Binding ElementName=Start}"/>
			<ContentControl Content="Configure the settings for the demo." IsEnabled="{Binding ElementName=Settings}"/>
			<ContentControl Content="Exit the demo." IsEnabled="{Binding ElementName=Exit}"/>
		</Grid>
    </StackPanel>
</UserControl>
The result is what you might expect
Capture.PNG
The green, yellow red back ground is just 2 triangles rendered in opengl with coordinates mapped to color just to see the renderer is working. On top of it the noesis gui.

Now lets add a ResourceDictionary to add some styles to make it possible to switch between menu pages. So taking your MenuResources.xaml from the Menu3D sample, delete every entry than those for the ToggleButton and see what happens:
<ResourceDictionary
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
    xmlns:local="clr-namespace:IngnomiaGUI"
    xmlns:noesis="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions">
    <Style x:Key="MenuButtonStyle" TargetType="{x:Type ToggleButton}">
        <Setter Property="OverridesDefaultStyle" Value="False"/>
        <Setter Property="FontSize" Value="26"/>
        <Setter Property="MinWidth" Value="300"/>
        <Setter Property="MinHeight" Value="30"/>
        <Setter Property="Margin" Value="5"/>
		<Setter Property="noesis:StyleInteraction.Triggers">
            <Setter.Value>
                <noesis:StyleTriggerCollection>
                    <i:EventTrigger EventName="MouseEnter">
                        <noesis:SetFocusAction/>
                    </i:EventTrigger>
                    <i:EventTrigger EventName="GotFocus">
                        <ei:PlaySoundAction Source="Sounds/WaterDropSmall.mp3" Volume="0.3"/>
                    </i:EventTrigger>
                    <i:EventTrigger EventName="Click">
                        <ei:PlaySoundAction Source="Sounds/WaterDropBig.mp3" Volume="0.5"/>
                    </i:EventTrigger>
                </noesis:StyleTriggerCollection>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="IsKeyboardFocused" Value="True">
                <Setter Property="IsChecked" Value="True"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</ResourceDictionary>
15:47:54:911 [D] [NOESIS] I Noesis Init v2.2.6 (Windows on x86_64 Profile)
15:47:54:939 [D] [NOESIS] I 'NoesisTheme.xaml' loaded
15:47:54:943 [D] [NOESIS] E MMStyles.xaml(13): Unknown property 'noesis:StyleInteraction.Triggers' setting Setter.Property.
15:47:54:947 [D] [NOESIS] E MMStyles.xaml(15): Unknown type 'NoesisGUIExtensions.StyleTriggerCollection'.
15:47:54:950 [D] [NOESIS] I 'MMStyles.xaml' loaded
15:47:54:953 [D] [NOESIS] I 'MainPage.xaml' loaded
15:47:54:957 [D] [NOESIS] E MMStyles.xaml(13): Unknown property 'noesis:StyleInteraction.Triggers' setting Setter.Property.
15:47:54:960 [D] [NOESIS] E MMStyles.xaml(15): Unknown type 'NoesisGUIExtensions.StyleTriggerCollection'.
15:47:54:963 [D] [NOESIS] I 'MMStyles.xaml' loaded
15:47:54:967 [D] [NOESIS] I 'SettingsPage.xaml' loaded
15:47:54:970 [D] [NOESIS] I 'MainMenu.xaml' loaded
15:47:54:973 [D] [NOESIS] E Setter.Property can't be null
15:47:54:979 [D] [NOESIS] E 'Converter<.?AVBaseComponent@Noesis@@>' binding converter failed to convert value 'ToggleButton: New Game' (type 'ToggleButton')
15:47:54:982 [D] [NOESIS] E 'Converter<.?AVBaseComponent@Noesis@@>' binding converter failed to convert value 'ToggleButton: Settings' (type 'ToggleButton')
15:47:54:987 [D] [NOESIS] E 'Converter<.?AVBaseComponent@Noesis@@>' binding converter failed to convert value 'ToggleButton: Exit' (type 'ToggleButton')
15:47:54:991 [D] [NOESIS] E Setter.Property can't be null
15:47:54:999 [D] [NOESIS] E Binding failed: Path=Settings, Source=null(''), Target=ToggleButton('Settings'), TargetProperty=ButtonBase.Command
Here is where I've been banging my head against a wall for some time now. Why is noesis:StyleInteraction.Triggers an unknown property? Am I missing some macro, some declaration somewhere? But where? What does the converter error mean? What's missing there?

I'm pretty confident that once this minimal example is running I'm pretty much in the green but right now I hit a pretty solid road block. So any help would be appreciated. Thanks

If you need to look at the c++ files https://drive.google.com/open?id=1HpP32 ... -9-uvr53OQ
 
User avatar
sfernandez
Site Admin
Posts: 1918
Joined: 22 Dec 2011, 19:20

Re: Some pre beginning questions

20 Jan 2020, 18:21

Interactivity classes are an extension that is not part of NoesisGUI core library (as they are not part of standard WPF), but you can find all the source code in our application framework.
You said you are not using application framework so you should copy all the source files from SDK folder Src/Packages/App/Interactivity/ to your project.
If you are already doing that you are probably missing to register the components so they can be created when xamls are parsed:
void RegisterComponents()
{
    Noesis::TypeOf<NoesisApp::Interaction>();
    Noesis::TypeOf<NoesisApp::StyleInteraction>();

    NsRegisterComponent<NoesisApp::BehaviorCollection>();
    NsRegisterComponent<NoesisApp::TriggerCollection>();
    NsRegisterComponent<NoesisApp::StyleBehaviorCollection>();
    NsRegisterComponent<NoesisApp::StyleTriggerCollection>();
    NsRegisterComponent<NoesisApp::EventTrigger>();
    NsRegisterComponent<NoesisApp::PropertyChangedTrigger>();
    NsRegisterComponent<NoesisApp::DataTrigger>();
    NsRegisterComponent<NoesisApp::KeyTrigger>();
    NsRegisterComponent<NoesisApp::GamepadTrigger>();
    NsRegisterComponent<NoesisApp::StoryboardCompletedTrigger>();
    NsRegisterComponent<NoesisApp::TimerTrigger>();
    NsRegisterComponent<NoesisApp::MouseDragElementBehavior>();
    NsRegisterComponent<NoesisApp::TranslateZoomRotateBehavior>();
    NsRegisterComponent<NoesisApp::ConditionBehavior>();
    NsRegisterComponent<NoesisApp::ConditionalExpression>();
    NsRegisterComponent<NoesisApp::ComparisonCondition>();
    NsRegisterComponent<NoesisApp::GoToStateAction>();
    NsRegisterComponent<NoesisApp::InvokeCommandAction>();
    NsRegisterComponent<NoesisApp::ChangePropertyAction>();
    NsRegisterComponent<NoesisApp::ControlStoryboardAction>();
    NsRegisterComponent<NoesisApp::RemoveElementAction>();
    NsRegisterComponent<NoesisApp::LaunchUriOrFileAction>();
    NsRegisterComponent<NoesisApp::PlaySoundAction>();
    NsRegisterComponent<NoesisApp::SetFocusAction>();
    NsRegisterComponent<NoesisApp::SelectAction>();
    NsRegisterComponent<NoesisApp::SelectAllAction>();
    NsRegisterComponent<Noesis::EnumConverter<NoesisApp::ComparisonConditionType>>();
    NsRegisterComponent<Noesis::EnumConverter<NoesisApp::ForwardChaining>>();
    NsRegisterComponent<Noesis::EnumConverter<NoesisApp::KeyTriggerFiredOn>>();
    NsRegisterComponent<Noesis::EnumConverter<NoesisApp::GamepadTriggerFiredOn>>();
    NsRegisterComponent<Noesis::EnumConverter<NoesisApp::GamepadButton>>();
    NsRegisterComponent<Noesis::EnumConverter<NoesisApp::ControlStoryboardOption>>();
}
I hope this helps.

Who is online

Users browsing this forum: Bing [Bot] and 0 guests