TabControl button size

For help with general CEGUI usage:
- Questions about the usage of CEGUI and its features, if not explained in the documentation.
- Problems with the CMAKE configuration or problems occuring during the build process/compilation.
- Errors or unexpected behaviour.

Moderators: CEGUI MVP, CEGUI Team

User avatar
sjcomp
Not too shy to talk
Not too shy to talk
Posts: 30
Joined: Wed Apr 27, 2005 14:59
Contact:

TabControl button size

Postby sjcomp » Tue Apr 29, 2008 16:54

Hello,

I'm using CELayoutEditor to add TabControl to my gui. It looks good at 640x480, but if I increase the screen resolution, then text in the tab buttons is to big to fit into the button. How can I change it, so it always fits?

Here is the example: 640x480
Image
And with the higher resolution:
Image
Thank you.
Regards, Alexander. http://sjcomp.com

User avatar
scriptkid
Home away from home
Home away from home
Posts: 1178
Joined: Wed Jan 12, 2005 12:06
Location: The Hague, The Netherlands
Contact:

Postby scriptkid » Tue Apr 29, 2008 18:42

Hi,

[edit] I replied with a note about the AutoScaled font setting, but appearantly the tabcontrol on my end looks okay with both this setting on or off, and on multiple resolutions. Maybe you can post your .font file contents + your layout? [/edit]


Thanks.
Check out my released snake game using Cegui!

User avatar
sjcomp
Not too shy to talk
Not too shy to talk
Posts: 30
Joined: Wed Apr 27, 2005 14:59
Contact:

Postby sjcomp » Tue Apr 29, 2008 22:00

Interesting to notice that there is no problem if I create tabcontrol at a large resolution. Text gets smaller as I decrease the resolution of the tabs.
Here we go:

Code: Select all

<?xml version="1.0" ?>
<Font Name="Tahoma-12" Filename="tahoma.ttf" Type="FreeType" Size="12" NativeHorzRes="800" NativeVertRes="600" AutoScaled="true"/>

I've created a new layout using CELayoutEditor 0.6.0. I've placed tab control when the resolution was set to 640x480 if I go to full screen 1440x900, then words are hardly fit into the tabs.

Code: Select all

<?xml version="1.0" encoding="UTF-8"?>

<GUILayout >
    <Window Type="DefaultWindow" Name="Root" >
        <Property Name="InheritsAlpha" Value="False" />
        <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
        <Property Name="UnifiedAreaRect" Value="{{0,0},{0,0},{1,0},{1,0}}" />
        <Window Type="TaharezLook/TabControl" Name="Root/t" >
            <Property Name="Font" Value="Tahoma-12" />
            <Property Name="TabHeight" Value="{0,22.2812}" />
            <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
            <Property Name="TabPanePosition" Value="Top" />
            <Property Name="UnifiedAreaRect" Value="{{0.3,0},{0.3,0},{0.732813,0},{0.55,0}}" />
            <Window Type="DefaultWindow" Name="Root/t/Tab 1" >
                <Property Name="Font" Value="Tahoma-12" />
                <Property Name="Text" Value="Global" />
                <Property Name="Visible" Value="False" />
                <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
                <Property Name="UnifiedAreaRect" Value="{{0,0},{0,0},{1,0},{1,0}}" />
            </Window>
            <Window Type="DefaultWindow" Name="Root/t/Tab 2" >
                <Property Name="Font" Value="Tahoma-12" />
                <Property Name="Text" Value="Qq" />
                <Property Name="UnifiedMaxSize" Value="{{1,0},{1,0}}" />
                <Property Name="UnifiedAreaRect" Value="{{0,0},{0,0},{1,0},{1,0}}" />
            </Window>
        </Window>
    </Window>
</GUILayout>

User avatar
sjcomp
Not too shy to talk
Not too shy to talk
Posts: 30
Joined: Wed Apr 27, 2005 14:59
Contact:

Postby sjcomp » Tue Apr 29, 2008 22:06

Actually I found that the only difference between tabcontrol created at a higher resolution is TabHeight value which is larger for a larger resolution and given that it's more than one it's given in pixels. So no matter what the resolution is the actual height of the tab stays the same. If it's ok in low resolution, than words stick out in high res, and if it looks good in high res, then the buttons are extra huge in a small resolution (because font is scaled).

Is there a way to make it proportional?

Thanks.

User avatar
CrazyEddie
CEGUI Project Lead
Posts: 6760
Joined: Wed Jan 12, 2005 12:06
Location: England
Contact:

Postby CrazyEddie » Mon May 05, 2008 07:45

Hi,

I did not get a chance to look at any code, but if there is no possibility to specify the tab button height as a UDim value, then this should be filed as a bug.

CE.

User avatar
sjcomp
Not too shy to talk
Not too shy to talk
Posts: 30
Joined: Wed Apr 27, 2005 14:59
Contact:

Postby sjcomp » Sun May 11, 2008 15:31

CrazyEddie wrote:I did not get a chance to look at any code, but if there is no possibility to specify the tab button height as a UDim value, then this should be filed as a bug.

I see in the lookandfeel file that

Code: Select all

        <Child  type="Simulator/TabButtonPane" nameSuffix="__auto_TabPane__Buttons">
            <Area>
                <Dim type="LeftEdge"><AbsoluteDim value="0" /></Dim>
                <Dim type="RightEdge"><UnifiedDim scale="1" type="Width" /></Dim>
                <Dim type="TopEdge">
                    <PropertyDim widget="__auto_TabPane__Buttons" name="EnableTop">
                        <DimOperator op="Multiply">
                            <UnifiedDim scale="1" type="Height">
                                <DimOperator op="Subtract">
                                    <PropertyDim name="TabHeight" type="Height" />
                                </DimOperator>
                            </UnifiedDim>
                        </DimOperator>
                    </PropertyDim>
                </Dim>
                <Dim type="Height"><PropertyDim name="TabHeight" type="Height" /></Dim>
            </Area>
        </Child>

It looks like there is UnifiedDim specified. But in the layout it's simply TabHeight, how can I specify that I want to use relative size?

Thanks.

User avatar
scriptkid
Home away from home
Home away from home
Posts: 1178
Joined: Wed Jan 12, 2005 12:06
Location: The Hague, The Netherlands
Contact:

Postby scriptkid » Sun May 11, 2008 16:12

Hi,

TabHeight is a UDim, so instead of the pixels you might make a combination. Let's say you want it to be 8% of your window, plus some pixels, use:

Code: Select all

<Property Name="TabHeight" Value="{0.08,5}" />


HTH.
Check out my released snake game using Cegui!

User avatar
sjcomp
Not too shy to talk
Not too shy to talk
Posts: 30
Joined: Wed Apr 27, 2005 14:59
Contact:

Postby sjcomp » Wed May 14, 2008 09:53

Thanks scriptkid, it did the trick!

User avatar
scriptkid
Home away from home
Home away from home
Posts: 1178
Joined: Wed Jan 12, 2005 12:06
Location: The Hague, The Netherlands
Contact:

Postby scriptkid » Wed May 14, 2008 10:01

^^Excellent :)
Check out my released snake game using Cegui!


Return to “Help”

Who is online

Users browsing this forum: No registered users and 29 guests