Hi Fam!
Are you looking to add modern, elegant, and highly customizable accordion or expandable sections to your app's UI? I'm excited to introduce B4XDaisyCollapse!
Based on the beautiful DaisyUI design system, this collapse component allows you to seamlessly show and hide content with professional styling and smooth state changes.
Key Features:
Simple Usage Example: Here's a quick snippet showing how easy it is to interact with the component programmatically:
Let me know what you think and share screenshots of how you use it in your apps! Happy coding!
Related Content
www.b4x.com
Are you looking to add modern, elegant, and highly customizable accordion or expandable sections to your app's UI? I'm excited to introduce B4XDaisyCollapse!
Based on the beautiful DaisyUI design system, this collapse component allows you to seamlessly show and hide content with professional styling and smooth state changes.
Key Features:- DaisyUI Variants: Fully supports semantic variants like primary, secondary, accent, info, success, warning, and error.
- Custom Icons: Built-in expansion indicators (arrow or plus) that can be positioned on the left or right to visually guide your users.
- Highly Customizable: Easily tweak border radiuses (rounded-md, rounded-full, etc.), shadows (sm to 2xl), border widths, and title text styling.
- Nested Content: Safely add any B4XView into the ContentView container. The component auto-measures your content's height so you don't have to guess dimensions!
- Responsive Widths: Works natively with Tailwind-style fraction widths (e.g., w-full, w-1/2, w-1/3).
Simple Usage Example: Here's a quick snippet showing how easy it is to interact with the component programmatically:
B4X:
Sub Globals
' Assuming myCollapse is added via the visual designer
Private myCollapse As B4XDaisyCollapse
End Sub
Sub B4XPage_Created (Root1 As B4XView)
Root1.LoadLayout("Main")
' Configure the title and style programmatically
myCollapse.TitleText = "Click to Expand Me!"
myCollapse.Variant = "primary"
myCollapse.Icon = "arrow"
' Create and add content to the collapse container
Dim lblContent As Label
lblContent.Initialize("")
lblContent.Text = "Here is the hidden content revealed!"
lblContent.TextSize = 14
' Automatically adapt the text color based on the selected variant
lblContent.TextColor = myCollapse.CollapseContent.TextColor
' Add the label to the inner content view.
' We use 0dip left because the container automatically provides standard 16dip padding.
myCollapse.ContentView.AddView(lblContent, 0, 8dip, myCollapse.ContentView.Width, 36dip)
End Sub
' Listen for state changes (perfect for repositioning views in a ScrollView!)
Private Sub myCollapse_StateChanged (Open As Boolean)
Log("Collapse state is now open: " & Open)
End SubLet me know what you think and share screenshots of how you use it in your apps! Happy coding!
Related Content
[B4X] [B4A] B4XDaisy UI Kit - Native Components inspired by DaisyUI & Tailwind
Hi Fam Disclaimer: The [B4A] in the title? This b4xlib has only been tested with B4A, thus the title. I have not checked the cross-platform functionality as its on the roadmap when I finish the complete library. The b4xlib is still in ALPHA stage, things might change, apis might break and...
www.b4x.com
Last edited:
