GUISlidingSidebar makes it easy to add a sliding sidebar to an Activity.
It's a wrapper around the gui-sliding-sidebar class by Julian Chu that can be found here: https://github.com/walkingice/gui-sliding-sidebar.
gui-sliding-sidebar is licensed under the Apache License, Version 2.0, more details can be found here: https://github.com/walkingice/gui-sliding-sidebar/blob/master/LICENSE
GUISlidingSidebar is quite a simple library to use, it has just a few methods and a single property:
All pretty self-explanatory!
It's important to note that the Views you pass to the SetViews method must not be currently added to the Activity.
Here's an example project:
I've created a ListView for the sidebar View and a Panel containing a Label and Button for the content View.
The sidebar is hidden when the Activity is first started, you could instead start your Activity with the sidebar View visible - the library will handle either state.
A click on the Button that i added to the content View will toggle the visibility of the sidebar, and a click on the content View will close the sidebar if it is currently visible.
The example project maintains the state of the Activity on orientation change by using a couple of Process_Global variables to save whether the sidebar is visible or not and the last selected ListView item index.
Fans of Lopsum Ipsum can find more here: Lorem Ipsum - All the facts - Lipsum generator!
Martin.
It's a wrapper around the gui-sliding-sidebar class by Julian Chu that can be found here: https://github.com/walkingice/gui-sliding-sidebar.
gui-sliding-sidebar is licensed under the Apache License, Version 2.0, more details can be found here: https://github.com/walkingice/gui-sliding-sidebar/blob/master/LICENSE
GUISlidingSidebar is quite a simple library to use, it has just a few methods and a single property:
- GUISlidingSidebar
Properties:- SidebarIsOpen As Boolean
- CloseSidebar
- Initialize
- OpenSidebar
- SetViews (ContentView As View, SidebarView As View)
Set the Content and Sidebar Views.
The maximum width of the Sidebar is 90% of it's parent.
These Views must NOT already be added to the Activity, otherwise an exception will occur. - ToggleSidebar
All pretty self-explanatory!
It's important to note that the Views you pass to the SetViews method must not be currently added to the Activity.
Here's an example project:
B4X:
'Activity module
Sub Process_Globals
Dim ContentStrings As Map
Dim CurrentContent As Int
Dim SidebarIsOpen As Boolean
End Sub
Sub Globals
Dim ContentButton As Button
Dim ContentLabel As Label
Dim ContentPanel As Panel
Dim GUISlidingSidebar1 As GUISlidingSidebar
Dim Sidebar As ListView
End Sub
Sub Activity_Create(FirstTime As Boolean)
If FirstTime Then
ContentStrings.Initialize
ContentStrings.Put("What is Lorem Ipsum?", "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.")
ContentStrings.Put("Why do we use it?", "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.")
ContentStrings.Put("Where does it come from?", "Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old.")
ContentStrings.Put("Where can I get some?", "There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text.")
ContentStrings.Put("Example Lopsum Ipsum", "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed a ante dui, eget egestas augue. Sed porttitor ultricies ante, eu viverra enim cursus sed. Morbi tempor dolor in metus sodales vitae tristique leo dignissim. Vivamus mi tortor, aliquet sit amet aliquet quis, lobortis ut massa. Cras fermentum ligula sit amet risus scelerisque fermentum. Nam nec ipsum nisl, et sollicitudin arcu. Nam non felis neque, eu auctor ipsum.")
CurrentContent=0
SidebarIsOpen=False
End If
ContentButton.Initialize("ContentButton")
ContentButton.Text="Sidebar"
ContentLabel.Initialize("")
ContentLabel.TextColor=Colors.Black
ContentLabel.TextSize=14dip
ContentPanel.Initialize("ContentPanel")
ContentPanel.Color=Colors.LightGray
ContentPanel.AddView(ContentLabel, 0, 0, 100%x, 100%y)
ContentPanel.AddView(ContentButton, 10dip, 100%y-60dip, 50dip, 50dip)
Sidebar.Initialize("Sidebar")
Dim i As Int
For i=0 To ContentStrings.Size-1
Sidebar.AddSingleLine(ContentStrings.GetKeyAt(i))
Next
Sidebar.Visible=SidebarIsOpen
GUISlidingSidebar1.Initialize
GUISlidingSidebar1.SetViews(ContentPanel, Sidebar)
Activity.AddView(GUISlidingSidebar1, 0, 0, 100%x, 100%y)
' Sidebar width can only be set AFTER it has been added to the Activity
Sidebar.Width=75%x
' set default state / restore last state
Activity.Title=ContentStrings.GetKeyAt(CurrentContent)
ContentLabel.Text=ContentStrings.GetValueAt(CurrentContent)
End Sub
Sub Activity_Resume
End Sub
Sub Activity_Pause (UserClosed As Boolean)
SidebarIsOpen=GUISlidingSidebar1.SidebarIsOpen
End Sub
Sub ContentButton_Click
GUISlidingSidebar1.ToggleSidebar
End Sub
Sub ContentPanel_Click
GUISlidingSidebar1.CloseSidebar
End Sub
Sub Sidebar_ItemClick (Position As Int, Value As Object)
Activity.Title=ContentStrings.GetKeyAt(Position)
ContentLabel.Text=ContentStrings.GetValueAt(Position)
CurrentContent=Position
GUISlidingSidebar1.CloseSidebar
End Sub
I've created a ListView for the sidebar View and a Panel containing a Label and Button for the content View.
The sidebar is hidden when the Activity is first started, you could instead start your Activity with the sidebar View visible - the library will handle either state.
A click on the Button that i added to the content View will toggle the visibility of the sidebar, and a click on the content View will close the sidebar if it is currently visible.
The example project maintains the state of the Activity on orientation change by using a couple of Process_Global variables to save whether the sidebar is visible or not and the last selected ListView item index.
Fans of Lopsum Ipsum can find more here: Lorem Ipsum - All the facts - Lipsum generator!
Martin.