Hey B4X Community!
Are you looking to modernize your app's user interface without spending hours writing complex custom styling code? I'm excited to share the B4XDaisyButton, a powerful custom view class that brings the beautiful, utility-first design principles of Tailwind CSS and DaisyUI directly into B4A!
The idea behind this component is simple: incredible aesthetics, minimal effort. Whether you need a standard call-to-action, a subtle text link, or a fully animated loading state, B4XDaisyButton has you covered.
Getting started is extremely straightforward. Here is a quick code snippet to add a customized button to your layout programmatically:
Related Content
Are you looking to modernize your app's user interface without spending hours writing complex custom styling code? I'm excited to share the B4XDaisyButton, a powerful custom view class that brings the beautiful, utility-first design principles of Tailwind CSS and DaisyUI directly into B4A!
The idea behind this component is simple: incredible aesthetics, minimal effort. Whether you need a standard call-to-action, a subtle text link, or a fully animated loading state, B4XDaisyButton has you covered.
- Semantic Color Variants: Choose from default, neutral, primary, secondary, accent, info, success, warning, or error themes.
- 6 Distinct Styles: Go beyond solid colors with soft, outline, dash, ghost, and link styles.
- Dynamic Sizing & Shaping: Easily adjust scales from xs to xl. Need specific layouts? Toggle Wide, Block, Square, or Circle properties.
- Built-in Interactivity: Support for Active and Disabled states, along with an integrated loading spinner for async tasks.
- SVG Icon Support: Easily pair your text with customizable SVG icons (or use icon-only square/circle buttons).
- Ready-to-Use Social Logins: Includes predefined styling and icons for major platforms like Google, Apple, GitHub, Microsoft, X, MetaMask, WeChat, LinkedIn, and more!.
Getting started is extremely straightforward. Here is a quick code snippet to add a customized button to your layout programmatically:
B4X:
' 1. Declare the button
Dim myPrimaryBtn As B4XDaisyButton
' 2. Initialize it with an EventName ("DemoBtn")
myPrimaryBtn.Initialize(Me, "DemoBtn")
' 3. Add to your parent view (e.g., Root or a Panel)
myPrimaryBtn.AddToParent(Root, 20dip, 20dip, 120dip, 40dip)
' 4. Customize properties just like DaisyUI!
myPrimaryBtn.Text = "Click Me!"
myPrimaryBtn.Variant = "primary" ' Set semantic color
myPrimaryBtn.Style = "outline" ' Apply outline style
myPrimaryBtn.Size = "md" ' Set medium size
myPrimaryBtn.Tag = "custom-tag-1" ' Optional tag for click handling
' ...
' 5. Handle the click event
Sub DemoBtn_Click(Tag As Object)
Log("Button clicked! Tag is: " & Tag)
ToastMessageShow("Clicked: " & Tag, False)
End SubRelated Content
[B4X] [B4A] B4XDaisy UI Kit - Native Components inspired by DaisyUI & Tailwind
Hi Fam Download from GitHub Download from Google Drive Track the Project Ask NotebookLLM about B4XDaisyUI I am proud to present the B4X Daisy UI Kit, a suite of native custom views designed to bring the modern aesthetic and utility of the DaisyUI (Tailwind CSS) framework to B4X...