Keybinding Widget

[Ludi]

Hi,

I'm currently trying to build a keybinding widget. I guess you all know it from other games. Basically, it's a label describing the keybinding and two buttons, where you can bind two different buttons to the same action.

I thought to put all the keybindings into a listbox. So, what's the best solution to do this? Should I subclass the listboxitem class, add two buttons and a text widget? Or can I do all this with a custom xml widget?

I'm really appreciate all help

[Levia]

Use ItemListbox! You can extend ItemEntry, and do the rest by looknfeel. Ive once done a checklistitem with this method (checkbox in front of the label...as item:) )

[Ludi]

Use ItemListbox! You can extend ItemEntry, and do the rest by looknfeel. Ive once done a checklistitem with this method (checkbox in front of the label...as item:) )

Okay, thanks for the info.

I took a look at ItemEntry, but I have no clue how to use it. I tried the search, but didn't find something that could help me.

What's the corret way of creating a subclass of ItemEntry? What's the use of the two string parameters of the constructor. I looked at MenuItem, but I still have no clue.

[Rackle]

Use ItemListbox! You can extend ItemEntry, and do the rest by looknfeel. Ive once done a checklistitem with this method (checkbox in front of the label...as item:) )

Levia needs to Wiki that...

[Levia]

I already did that! A while ago
http://www.cegui.org.uk/wiki/index.php/ ... istboxItem

[Taharez]

I just used a MultiColumnList for keybindings Works well so far

[Levia]

Yeah same here

[Ludi]

Thanks for the help so far.

Here's the look'n'feel I have so far:

Code: Select all

  <WidgetLook name="TaharezLook/KeybindingItemEntry">
    <NamedArea name="ContentSize">
      <Area>
        <Dim type="LeftEdge" >
          <AbsoluteDim value="0" />
        </Dim>
        <Dim type="TopEdge" >
          <AbsoluteDim value="0" />
        </Dim>
        <Dim type="Width" >
          <UnifiedDim scale="0.9" type="Width" />
        </Dim>
[b]        <Dim type="Height" >
          <FontDim type="LineSpacing" />
        </Dim>[/b]
      </Area>
    </NamedArea>

    <Child type ="TaharezLook/StaticText" nameSuffix="__auto__text">
      <Area>
        <Dim type="LeftEdge">
          <UnifiedDim scale="0" type="LeftEdge" />
        </Dim>
        <Dim type="TopEdge">
          <UnifiedDim scale="0" type="TopEdge" />
        </Dim>
        <Dim type="Width">
          <UnifiedDim scale="0.4" type="Width" />
        </Dim>
        <Dim type="Height">
          <UnifiedDim scale="1" type="Height"/>
        </Dim>
      </Area>
    </Child>

    <Child type ="TaharezLook/Button" nameSuffix="__auto__action1">
      <Area>
        <Dim type="LeftEdge">
          <UnifiedDim scale="0.4" type="LeftEdge" />
        </Dim>
        <Dim type="TopEdge">
          <UnifiedDim scale="0.1" type="TopEdge" />
        </Dim>
        <Dim type="Width">
          <UnifiedDim scale="0.29" type="Width" />
        </Dim>
        <Dim type="Height">
          <UnifiedDim scale="0.8" type="Height"/>
        </Dim>
      </Area>
    </Child>

    <Child type ="TaharezLook/Button" nameSuffix="__auto__action2">
      <Area>
        <Dim type="LeftEdge">
          <UnifiedDim scale="0.7" type="LeftEdge" />
        </Dim>
        <Dim type="TopEdge">
          <UnifiedDim scale="0.1" type="TopEdge" />
        </Dim>
        <Dim type="Width">
          <UnifiedDim scale="0.29" type="Width" />
        </Dim>
        <Dim type="Height">
          <UnifiedDim scale="0.8" type="Height"/>
        </Dim>
      </Area>
    </Child>
   
    <StateImagery name="Enabled">
   </StateImagery>
    <StateImagery name="Disabled">
    </StateImagery>
    <StateImagery name="SelectedEnabled">
    </StateImagery>
    <StateImagery name="SelectedDisabled">
    </StateImagery>

  </WidgetLook>

It creates a static text and two buttons. Now I have one problem: I can't change the height of the ItemEntry. I changed the bold line, but without success. What's the correct way of doing it?

And can I set properties for the childs within the looknfeel? I want to disable the background and the frameborder of the static text.

[Rackle]

Replace <FontDim type="LineSpacing" /> with <AbsoluteDim value="80" /> to specify a different type of dimension specification; an absolute dimension rather than one relative to a font. The original one is great if you want to code that looknfeel to support a font of size 10 as well as a font of size 36.

[Ludi]

Replace <FontDim type="LineSpacing" /> with <AbsoluteDim value="80" /> to specify a different type of dimension specification; an absolute dimension rather than one relative to a font. The original one is great if you want to code that looknfeel to support a font of size 10 as well as a font of size 36.

Thanks for the answer, but that doesn't help much, because it's an absolut value (I guess in pixel). So, it's resolution dependent and that's not what I want. And when I use a uniform diff, nothing shows up. Or can I use something like 2*LineSpacing?

And one programming question: The text and buttons are added as child to the ItemEntry, so I guess I can access them like this:

Code: Select all

            Window *text = getChildAtIdx(0);
            PushButton *action1 = static_cast<PushButton *>(getChildAtIdx(1));
            PushButton *action2 = static_cast<PushButton *>(getChildAtIdx(2));

Now, is there a virtual function or an event, which I can use to see, if they are added. Because I guess I can't use the above code in the constructor of my derived class as the text and buttons are not added yet.

[Rackle]

From the Falagard System XML elements reference

Code: Select all

<WidgetLook name="TaharezLook/FrameWindow">
  ...
  <Child type="TaharezLook/Titlebar" nameSuffix="__auto_titlebar__">
    <Area>
      <Dim type="LeftEdge" ><AbsoluteDim value="0" /></Dim>
      <Dim type="TopEdge" ><AbsoluteDim value="0" /></Dim>
      <Dim type="Width" ><UnifiedDim scale="1" type="Width" /></Dim>
      <Dim type="Height" >
        <FontDim type="LineSpacing">
          <DimOperator op="Multiply">
            <AbsoluteDim value="1.5" />
          </DimOperator>
        </FontDim>
      </Dim>
    </Area>
    <Property name="AlwaysOnTop" value="False" />
  </Child>
  ...
</WidgetLook>


The sample multiplies the line spacing by a factor of 1.5.

There's also the UnifiedDim :

Code: Select all

  <Dim type="LeftEdge">
    <UnfiedDim scale="0.5" offset="-8" type="LeftEdge" />
  </Dim>


>> And one programming question: The text and buttons are added as child to the ItemEntry, so I guess I can access them like this


Try the getName() of the item and then suffixing the _auto_ from the looknfeel:

createWindow("TaharezLook/KeybindingItemEntry", "MyWindow");
windowManager.isWindowPresent("MyWindow" + "__auto__action1");

[Ludi]

Okay, thanks rackle for your help so far. I tried the multiply of the line spacing and it worked fine. The UnifiedDim doesn't work, I only get an empty ItemListBox.

And getting the children doesn't work. As I said before: When window gets created, it doesn't have it's children added yet. But I need to access them in order to set some properties of them.

And one more thing about the wiki article, there's a small mistake in the following code:

wfMgr.addFalagardWindowMapping("WindowsLook/CheckListboxItem", "CEGUI/ItemEntry", "WindowsLook/CheckListboxItem", "Falagard/ItemEntry");

must be:

wfMgr.addFalagardWindowMapping("WindowsLook/CheckListboxItem", "CEGUI/CheckListboxItem", "WindowsLook/CheckListboxItem", "Falagard/ItemEntry");

With the upper part, the CheckListboxItem gets ItemEntry as baseclass, which is wrong, as it needs the class CheckListboxItem as baseclass. In this case, it doesn't make a difference, as CheckListboxItem doesn't have member variables and there everything works as it should.

[Ludi]

Okay, I found the method, it is initialiseComponents

Code: Select all

         virtual void initialiseComponents()
         {
            ItemEntry::initialiseComponents();

            Window *text = getChildAtIdx(0);
            PushButton *action1 = static_cast<PushButton *>(getChildAtIdx(1));
            PushButton *action2 = static_cast<PushButton *>(getChildAtIdx(2));
         }

Thanks everyone for the help