B4A Library [B4X] [XUI] AS Settings

Introducing a new library that allows you to create your own settings page with minimal code. This library comes equipped with automatic saving and loading features, making it incredibly easy to manage your settings. It supports booleans, free text, numbers, comboboxes, action buttons and more, giving you a wide range of options to customize your settings page. With this library, you can quickly and easily create a professional-looking settings page for your application or app without having to worry about complicated coding.

I spend a lot of time in creating views, like this and to create a high quality view cost a lot of time. If you want to support me and further views, then you can do it here by Paypal or with a coffee.

The library is still in a beta phase, things can still change and there are still bugs that need to be fixed.

It uses conditional symbols in order to avoid adding dependencies when a feature is not required.

Feature​	Conditional Symbol​	Dependencies​	min Version​	Comments​
SegmentedTab	SETTINGS_SegmentedTab	AS_SegmentedTab	1.17
PlusMinus	SETTINGS_PlusMinus	AS_PlusMinus	1.00
DatePicker		AS_BottomDatePicker	1.01
TimePicker		AS_TimePickerDialog	1.02

[B4X] AS Settings with SegmentedTab

This is an extension for the AS_Settings library, if it activates this extension, then you can select settings via a new type. Guide Download AS_SegmentedTab Copy it to your additional lib. folder Check the AS_SegmentedTab in the lib. list in your project Click in B4J, B4A or B4I Project ->...

www.b4x.com

[B4X] AS Settings with PlusMinus

This is an extension for the AS_Settings library, if it activates this extension, then you can select settings via a new type. Guide Download AS_PlusMinus Copy it to your additional lib. folder Check the AS_PlusMinus in the lib. list in your project Click in B4J, B4A or B4I Project -> Build...

www.b4x.com

[B4X] AS Settings with AS BottomDatePicker

In this example it is shown how to realize date entries with the AS_Settings library. You need AS_Settings V1.02+ and AS_BottomDatePicker V1.01+ for this example. Private Sub B4XPage_Created (Root1 As B4XView) Root = Root1 Root.LoadLayout("frm_main") B4XPages.SetTitle(Me,"AS...

www.b4x.com

[B4X] AS Settings with AS TimePickerDialog

In this example it is shown how to realize time entries with the AS_Settings library. You need AS_Settings V1.02+ and AS_TimePickerDialog V1.02+ for this example. Private Sub B4XPage_Created (Root1 As B4XView) Root = Root1 Root.LoadLayout("frm_main") B4XPages.SetTitle(Me,"AS...

www.b4x.com

Examples:

AS_Settings1.AddGroup("Basic","Basic Settings")
 
'Boolean
AS_Settings1.AddProperty_Boolean("Basic","PropertyName_1","Boolean Property True",Null,True)
AS_Settings1.AddProperty_Boolean("Basic","PropertyName_2","Boolean Property False",Null,False)
AS_Settings1.AddProperty_Boolean("Basic","PropertyName_3","Boolean Property True with a long text",Null,True)
'Action Button
AS_Settings1.AddProperty_Action("Basic","PropertyName_4","Action Property",Null,"English")
AS_Settings1.AddProperty_Action("Basic","PropertyName_5","Icon",AS_Settings1.FontToBitmap(Chr(0xF179),False,30,xui.Color_White),"English, German, Italian, Spanish, Swedish")
AS_Settings1.AddProperty_ActionClean("Basic","PropertyName_6","Delete Account",AS_Settings1.FontToBitmap(Chr(0xE92B),True,34,xui.Color_White))
AS_Settings1.AddProperty_Action("Basic","PropertyName_7","Pro Feature",Null,"Pro")
 
AS_Settings1.AddGroup("Advanced","Advanced Settings")
 
'Numeric Example
AS_Settings1.AddProperty_Text("Advanced","PropertyName_8","Text Example",Null,"Test",100dip,AS_Settings1.InputType_Text)
AS_Settings1.AddProperty_Text("Advanced","PropertyName_9","Numeric Example",Null,24,60dip,AS_Settings1.InputType_Numeric)
AS_Settings1.AddProperty_Text("Advanced","PropertyName_10","Decimal Example",Null,24.24,100dip,AS_Settings1.InputType_Decimal)
'ComboBox
AS_Settings1.AddProperty_ComboBox("Advanced","PropertyName_11","ComboBox Example",Null,1,Array("Option 1","Option 2","Option 3","Option 4"))
 
AS_Settings1.Create

'You can call this anywhere in your app without initializing the view first
AS_Properties.GetProperty("PropertyName_1")
AS_Properties.GetPropertyDefault("PropertyName_1",True)
AS_Properties.PutProperty("PropertyName_1",True)

Spoiler: Dependencies/Libraries you need for this view

B4j: jXUI,jSQL,xCustomListView,XUI Views
B4a: XUi,SQL,xCustomListView,XUI Views
B4i: iXUI,iSQL,xCustomListView,XUI Views

AS_Settings
Author: Alexander Stolte
Version: 1.00

Spoiler: Properties, Functions, Events, etc.

• ASSettings_CustomDrawProperty
  • Fields:
    • Group As ASSettings_Group
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • Property As ASSettings_Property
    • PropertySettingViews As ASSettings_PropertySettingViews
    • PropertyViews As ASSettings_PropertyViews
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASSettings_Group
  • Fields:
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • Key As String
    • Name As String
    • Properties As List
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASSettings_Property
  • Fields:
    • DisplayName As String
    • Group As ASSettings_Group
    • Icon As B4XBitmap
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • isLast As Boolean
    • ItemList As List
    • PropertyName As String
    • Value As Object
    • ValueType As String
    • ValueTypeTextProperties As ASSettings_ValueTypeTextProperties
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASSettings_PropertySettingViews
  • Fields:
    • ActionButtonArrowLabel As B4XView
    • ActionValueLabel As B4XView
    • BackgroundPanel As B4XView
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASSettings_PropertyViews
  • Fields:
    • BackgroundPanel As B4XView
    • IconImageView As B4XView
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • NameLabel As B4XView
    • RootBackgroundPanel As B4XView
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• ASSettings_ValueTypeTextProperties
  • Fields:
    • Color As Int
    • CornerRadius As Float
    • Height As Float
    • InputType As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • TextColor As Int
    • Width As Float
    • xFont As B4XFont
  • Functions:
    • Initialize
      Initializes the fields to their default value.
• AS_Properties
  • Functions:
    • GetProperty (PropertyName As String) As Object
    • GetPropertyDefault (PropertyName As String, DefaultValue As Object) As Object
      Gets a property value, if no value has been stored by this property yet, the default value is returned
    • Initialize As String
    • process_globals
    • PutProperty (PropertyName As String, Value As Object) As String
• AS_Settings
  • Events:
    • ActionClicked (Property As ASSettings_Property)
    • CustomDrawProperty (CustomDrawProperty As ASSettings_CustomDrawProperty)
    • ValueChanged (Property As ASSettings_Property, Value As Object)
  • Fields:
    • mBase As B4XView
    • Tag As Object
  • Functions:
    • AddGroup (Key As String, Name As String) As String
    • AddProperty_Action (GroupKey As String, PropertyName As String, DisplayName As String, Icon As B4XBitmap, DefaultValue As Object) As String
    • AddProperty_ActionClean (GroupKey As String, PropertyName As String, DisplayName As String, Icon As B4XBitmap) As String
    • AddProperty_Boolean (GroupKey As String, PropertyName As String, DisplayName As String, Icon As B4XBitmap, DefaultValue As Boolean) As String
      <code>AS_Settings1.AddProperty_Boolean("General","PropertyName_1","Boolean Property True",Null,True)</code>
    • AddProperty_ComboBox (GroupKey As String, PropertyName As String, DisplayName As String, Icon As B4XBitmap, DefaultValue As String, ItemList As List) As String
    • AddProperty_Text (GroupKey As String, PropertyName As String, DisplayName As String, Icon As B4XBitmap, DefaultValue As Object, Width As Float, InputType As String) As String
    • Base_Resize (Width As Double, Height As Double) As String
    • Class_Globals As String
    • Create
    • CreateASSettings_CustomDrawProperty (Group As ASSettings_Group, Property As ASSettings_Property, PropertyViews As ASSettings_PropertyViews, PropertySettingViews As ASSettings_PropertySettingViews) As ASSettings_CustomDrawProperty
    • CreateASSettings_Group (Key As String, Name As String, Properties As List) As ASSettings_Group
    • CreateASSettings_Property (PropertyName As String, DisplayName As String, Icon As B4XBitmap, ValueType As String, Value As Object, ItemList As List, ValueTypeTextProperties As ASSettings_ValueTypeTextProperties) As ASSettings_Property
    • CreateASSettings_PropertySettingViews (BackgroundPanel As B4XView, ActionButtonArrowLabel As B4XView, ActionValueLabel As B4XView) As ASSettings_PropertySettingViews
    • CreateASSettings_PropertyViews (RootBackgroundPanel As B4XView, BackgroundPanel As B4XView, IconImageView As B4XView, NameLabel As B4XView) As ASSettings_PropertyViews
    • CreateASSettings_ValueTypeTextProperties (Width As Float, Height As Float, xFont As B4XFont, TextColor As Int, Color As Int, InputType As String, CornerRadius As Float) As ASSettings_ValueTypeTextProperties
    • DesignerCreateView (Base As Object, Lbl As Label, Props As Map) As String
      Base type must be Object
    • FontToBitmap (text As String, IsMaterialIcons As Boolean, FontSize As Float, color As Int) As B4XBitmap
      

      FontAwesome To Bitmap

      Unlike an older "TextToBitmap" sub that you can find in the forum, this code vertically centers the icon. It can also be used in B4J and B4i (only need to change the font line). Sub Activity_Create(FirstTime As Boolean) 'usage example Activity.AddMenuItem3("Android", "Test"...

      www.b4x.com
    • getBackgroundColor As Int
    • getCornerRadius As Int
    • getGroupHeight As Float
    • getGroupNameBackgroundColor As Int
    • getHapticFeedback As Boolean
    • getInputType_Decimal As String
    • getInputType_Numeric As String
    • getInputType_Text As String
    • getPadding As Float
    • getPropertyColor As Int
    • getPropertyHeight As Float
    • getPropertySeperator As Boolean
    • getPropertySeperatorColor As Int
    • getSaveMode As String
      <code>AS_Settings1.SaveMode = AS_Settings1.SaveMode_Automatic</code>
    • getSaveMode_Automatic As String
    • getSaveMode_Manual As String
    • getSwitchFalseColor As Int
    • getSwitchThumbColor As Int
    • getSwitchTrueColor As Int
    • getValueType_Action As String
      Displays an arrow, the user can click on it and can be redirected to another page
    • getValueType_ActionClean As String
      Same as Action, but without an arrow and description
    • getValueType_Boolean As String
      Switch or Checkbox
    • getValueType_ComboBox As String
      Mit hoch Runter Icon
    • getValueType_Custom As String
    • getValueType_Text As String
    • Initialize (Callback As Object, EventName As String) As String
    • IsInitialized As Boolean
      Tests whether the object has been initialized.
    • Refresh As String
    • setBackgroundColor (Color As Int) As String
      Background Color of the view
    • setCornerRadius (Radius As Int) As String
      The corner radius of a group
    • setGroupHeight (Height As Float) As String
      Height of a group name
    • setGroupNameBackgroundColor (Color As Int) As String
      The Background Color of the group name
    • setHapticFeedback (Enabled As Boolean) As String
      Haptic feedback of the switches and click actions
    • setPadding (Padding As Float) As String
      The Padding Left and Right
      Default value: 10dip
    • setPropertyColor (Color As Int) As String
      Background Color of a property
    • setPropertySeperator (Show As Boolean) As String
      If true a seperator is shown under a property
    • setPropertySeperatorColor (Color As Int) As String
      Color of the seperator
    • setSaveMode (Mode As String) As String
    • setSwitchFalseColor (Color As Int) As String
    • setSwitchThumbColor (Color As Int) As String
    • setSwitchTrueColor (Color As Int) As String
  • Properties:
    • BackgroundColor As Int
      Background Color of the view
    • CornerRadius As Int
      The corner radius of a group
    • GroupHeight As Float
      Height of a group name
    • GroupNameBackgroundColor As Int
      The Background Color of the group name
    • HapticFeedback As Boolean
      Haptic feedback of the switches and click actions
    • InputType_Decimal As String [read only]
    • InputType_Numeric As String [read only]
    • InputType_Text As String [read only]
    • Padding As Float
      The Padding Left and Right
      Default value: 10dip
    • PropertyColor As Int
      Background Color of a property
    • PropertyHeight As Float [read only]
    • PropertySeperator As Boolean
      If true a seperator is shown under a property
    • PropertySeperatorColor As Int
      Color of the seperator
    • SaveMode As String
      <code>AS_Settings1.SaveMode = AS_Settings1.SaveMode_Automatic</code>
    • SaveMode_Automatic As String [read only]
    • SaveMode_Manual As String [read only]
    • SwitchFalseColor As Int
    • SwitchThumbColor As Int
    • SwitchTrueColor As Int
    • ValueType_Action As String [read only]
      Displays an arrow, the user can click on it and can be redirected to another page
    • ValueType_ActionClean As String [read only]
      Same as Action, but without an arrow and description
    • ValueType_Boolean As String [read only]
      Switch or Checkbox
    • ValueType_ComboBox As String [read only]
      Mit hoch Runter Icon
    • ValueType_Custom As String [read only]
    • ValueType_Text As String [read only]

Changelog

• 1.00
  • Release
• 1.01 (read more)
  • AS_Settings
    • BugFixes
    • Add AddProperty_SegmentedTab - You can now add the AS_SegmentedTab
    • Add AddProperty_PlusMinus - You can now add the AS_PlusMinus
    • Add get ValueTypeTextProperties - Change the appearance of the text edits
    • Breaking Change - Add Description Property to all AddProperty_ functions
      • You can now display a short descripton to your properties
    • Add Designer Property ShowMadeWithLove - Shows the Made with Love in B4X Badge at the end of the list
      • Default: False
    • Add Designer Property MadeWithLoveTextColor - Text Color of the Made with Love Badge
      • Default: White
    • Add Designer Property BottomText - a custom text on the end of the list
      • Default: ""
    • Add Designer Property BottomTextTextColor
      • Default: White
  • AS_Properties
    • Add RemoveProperty - Removes a property from the db
    • Add ClearProperties - Clears all properties from the db
• 1.02 (read more)
  • AS_Properties
    • Breaking change - For the intern database i'm now using the KeyValueStore lib.
      • This means that all settings are reset by the update
    • ClearProperties renamed to DeleteAllProperties
    • Add get KeyValueStore
  • AS_Settings
    • BugFixes in Property_SegmentedTab
      • AS_SegmentedTab V1.18+ needed
    • Add AddProperty_Chooser - looks like an AddProperty_Text, but is a label with click event
    • Add Event ChooserTextFieldClicked - Is triggered when you click on an AddProperty_Chooser
    • Add AddProperty_Custom - Is a CustomDrawProperty field, the CustomDrawProperty event is triggered, there you can add your own layout
    • Add Event CustomDrawProperty - You can now add your custom property layout
    • Add CustomDrawProperty_Add - You can add any view with this function and It is automatically added to the layout, you don't have to worry about where to put it
    • Add CustomDrawProperty_AddChooser - A chooser view is created
    • Add CustomDrawProperty_AddText - A simple text item
• 1.03
  • AS_Settings
    • Add ResetGroups - Removes the groups, so that you can fill the view with new groups, without the groups that were previously visible

Have Fun

 

[Alexander Stolte]

Planned features

• Custom Views
  • Offer the possibility to integrate your own views
  • 
• AS_SegmentedTab
  • 
• AS_PlusMinus
  • 
• Property Description
  • 
• Orientation changes
• Another view with which it should be possible to select multiple choices, another page when you have clicked on an action button

 

[Alexander Stolte]

For those who are interested in how long such a view needs until it sees the 1st time the forum:

 

[asales]

Another great library. Thanks!

 

[Alexander Stolte]

Another great library. Thanks!

Saves you a lot of work and easy to use.

 

[GMan]

Just have an App completed with my old, time-expensive Setup-Enchilada.

Will give yours a try in the next version

And as always - good job

 

[Lello1964]

Great job, i'll send you Paypal donation, pls add ip setting.

 

[Alexander Stolte]

pls add ip setting.

IP Setting ?
You can already store IP addresses. The only question is how you will let the user change them.
There are 3 possibilities:
-With the TextField
-ActionButton and open another page where the user can then select or enter the IP
-ComboBox where he can select one of the IP addresses

 

[Lello1964]

hope xxx.xxx.xxx with check single value.

 

[Alexander Stolte]

I wrote you a PM, I don't like to discuss something like that in the main thread.

 

[Xfood]

congratulations, fantastic idea and fantastic library, it would be nice to add:
1- color selector,
2- date selector,
3- time selector

 

[Alexander Stolte]

1- color selector,
2- date selector,
3- time selector

then becomes part of the custom property. There you can add AS_WheelPicker or ColorPicker. But when the whole thing comes I don't know.

 

[GMan]

Give all ;-)

 

[AnandGupta]

Month, Year selector.

Example subscription paid from Apr 2023 to Mar 2024. Here we just need drop down for month and year, and not a full date calendar.

 

[lucasheer]

You are incredible! Thank you!

 

[Alexander Stolte]

Update

• 1.01
  • AS_Settings
    • BugFixes
    • Add AddProperty_SegmentedTab - You can now add the AS_SegmentedTab
    • Add AddProperty_PlusMinus - You can now add the AS_PlusMinus
    • Add get ValueTypeTextProperties - Change the appearance of the text edits
    • Breaking Change - Add Description Property to all AddProperty_ functions
      • You can now display a short descripton to your properties
    • Add Designer Property ShowMadeWithLove - Shows the Made with Love in B4X Badge at the end of the list
      • Default: False
    • Add Designer Property MadeWithLoveTextColor - Text Color of the Made with Love Badge
      • Default: White
    • Add Designer Property BottomText - a custom text on the end of the list
      • Default: ""
    • Add Designer Property BottomTextTextColor
      • Default: White
  • AS_Properties
    • Add RemoveProperty - Removes a property from the db
    • Add ClearProperties - Clears all properties from the db

AddProperty_SegmentedTab

[B4X] AS Settings with SegmentedTab

This is an extension for the AS_Settings library, if it activates this extension, then you can select settings via a new type. Guide Download AS_SegmentedTab Copy it to your additional lib. folder Check the AS_SegmentedTab in the lib. list in your project Click in B4J, B4A or B4I Project ->...

www.b4x.com

AddProperty_PlusMinus

[B4X] AS Settings with PlusMinus

This is an extension for the AS_Settings library, if it activates this extension, then you can select settings via a new type. Guide Download AS_PlusMinus Copy it to your additional lib. folder Check the AS_PlusMinus in the lib. list in your project Click in B4J, B4A or B4I Project -> Build...

www.b4x.com

Add Description Property to all AddProperty_ functions

ShowMadeWithLove and BottomText

 

[Alexander Stolte]

Update

• 1.02
  • AS_Properties
    • Breaking change - For the intern database i'm now using the KeyValueStore lib.
      • This means that all settings are reset by the update
    • ClearProperties renamed to DeleteAllProperties
    • Add get KeyValueStore
  • AS_Settings
    • BugFixes in Property_SegmentedTab
      • AS_SegmentedTab V1.18+ needed
    • Add AddProperty_Chooser - looks like an AddProperty_Text, but is a label with click event
    • Add Event ChooserTextFieldClicked - Is triggered when you click on an AddProperty_Chooser
    • Add AddProperty_Custom - Is a CustomDrawProperty field, the CustomDrawProperty event is triggered, there you can add your own layout
    • Add Event CustomDrawProperty - You can now add your custom property layout
    • Add CustomDrawProperty_Add - You can add any view with this function and It is automatically added to the layout, you don't have to worry about where to put it
    • Add CustomDrawProperty_AddChooser - A chooser view is created
    • Add CustomDrawProperty_AddText - A simple text item

Version 1.02 is not compatible with version 1.01, because a new database is used internally, all previous settings are reset.

AddProperty_Chooser

Can be used to open other views so that the user can make entries

2 New Example Projects added. They show how to use the AddProperty_Chooser and AddProperty_Custom property.

[B4X] AS Settings with AS BottomDatePicker

In this example it is shown how to realize date entries with the AS_Settings library. You need AS_Settings V1.02+ and AS_BottomDatePicker V1.01+ for this example. Private Sub B4XPage_Created (Root1 As B4XView) Root = Root1 Root.LoadLayout("frm_main") B4XPages.SetTitle(Me,"AS...

www.b4x.com

[B4X] AS Settings with AS TimePickerDialog

In this example it is shown how to realize time entries with the AS_Settings library. You need AS_Settings V1.02+ and AS_TimePickerDialog V1.02+ for this example. Private Sub B4XPage_Created (Root1 As B4XView) Root = Root1 Root.LoadLayout("frm_main") B4XPages.SetTitle(Me,"AS...

www.b4x.com

 

[Mashiane]

Hi

Assuming that I want to make this reusable to display different properties depending on choices I make. How do I clear existing properties?

 

[Alexander Stolte]

How do I clear existing properties?

AS_Properties.DeleteAllProperties 'All
AS_Properties.RemoveProperty("PropertyName") 'Just one

 

[Mashiane]

I see, first post is v 1.01. How can I get V1.02?