Hi my name is Joshua, I am a boxee and all around Python developer who will now be contributing to gonzee.tv. I have a background in web application and social networking development, but I’m also a huge HTPC nut. Boxee is the perfect middle ground. I hope my articles help you out in times of need.
Without further ado…
The sidebar is used in the factory boxee sections. It’s on the side and lets you sort, filter, and otherwise manipulate the list in the factory boxee sections.
The sidebar would be a great place to put things like preferences, sorting, and less used items within an app. The information is out of the way, but still in a comfortable place that is consistent throughout the boxee interface.
I’ve been wanting to use this in my own apps to really pull the experience together, so I started tearing apart the boxee skins. There are many “classes” and other things in the boxee skin files that you can use in your own apps to save code and increase consistency. I would recommend any developer to take a look.
I’ve recovered the base code required to have the sidebar working on your app:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
| <control type="group" id="9000">
<include>BrowseListsAnimation</include> # This is required for some reason.
# Put your main app xml here.
#
# For example a list:
<control type="list" id="600">
<description>Media items</description>
<posx>40</posx>
<posy>160</posy>
<width>600</width>
<height>520</height>
<onleft>8000</onleft> # Notice pushing left activates the sidebar from this list.
<onright>-</onright>
<onup>200</onup>
<ondown>-</ondown>
<scrolltime>200</scrolltime>
<pagecontrol>-</pagecontrol>
<orientation>vertical</orientation>
<itemlayout width="600" height="60">
<control type="label">
<posx>0</posx>
<posy>0</posy>
<width>560</width>
<height>40</height>
<font>font28</font>
<align>left</align>
<label>$INFO[ListItem.Label]</label>
<textcolor>grey</textcolor>
</control>
</itemlayout>
<focusedlayout width="1280" height="60">
<control type="label">
<posx>0</posx>
<posy>0</posy>
<width>560</width>
<height>40</height>
<font>font28</font>
<align>left</align>
<scroll>true</scroll>
<scrollspeed>30</scrollspeed>
<label>$INFO[ListItem.Label]</label>
<textcolor>white</textcolor>
</control>
</focusedlayout>
</control>
</control>
<control type="group" id="8000"> # This is the sidebar
<include>BrowseLeftMenuAnimation</include> # Required for some reason.
<include>BrowseLeftMenuBackground</include> # This includes everything to draw the
# background of the sidebar
<control type="grouplist"> # A grouplist is a good idea so that if
<include>BrowseLeftMenu</include> # there's too many controls, it can scroll.
<control type="label" id="402">
<include>BrowseLeftMenuTitle</include> # <- there are some 'classes' I found
<label>[UPPERCASE]Available Feeds[/UPPERCASE]</label>
</control>
# Include whatever you want on the sidebar here.
# Make sure to add "<onright>9000</onright>" to the elements so you can get back to
# your app.
</control>
</control> |
Make sure to remove all of the comments before trying this code, the boxee XML parser doesn’t like python comments (#).
This will get you an empty window with a sidebar on the left.
Enjoy.
