FlutterSwiftUI 🚀

FlutterSwiftUI is a modern SwiftUI component library inspired by Flutter’s flexible and expressive UI framework. It provides a rich set of UI components to help you build beautiful and responsive applications with ease.

• Description: Easily display styled text in your app.
• Usage: Customize fonts, colors, and spacing.

• Description: Add animated padding transitions to your elements.
• Usage: Smoothly animate padding changes for dynamic layouts.

• Description: Apply constraints to children (like width or height) within your layout.
• Usage: Ensure your views do not exceed specific dimensions.

• Description: Prevent user interactions with an element and its children.
• Usage: Disable hit testing on views when needed.

• Description: A container for swiping through pages.
• Usage: Create swipeable content views.

• Description: A dynamically generated page view.
• Usage: Build pages on-demand for large datasets.

• Description: A custom-styled page view.
• Usage: Fully customize the look and feel of your paged content.

• Description: A scroll view that supports nested scrolling views.
• Usage: Combine multiple scrollable areas into one smooth experience.

• Description: A scroll view that allows for custom scrollable layouts.
• Usage: Build complex scrollable layouts with lazy loading.

• Description: A box that limits its size when unconstrained.
• Usage: Ensure your view does not grow beyond a maximum size.

• Description: A component to animate the positioning of an element.
• Usage: Animate changes in position for dynamic UIs.

• Description: A component to animate directional positioning of an element.
• Usage: Animate directional layout changes with ease.

• 🎨 More style properties: Deepen customization of your text styling.
• 📅 onEnd Callback: Handle animation completion events in AnimatedComponents.

This library offers a wide variety of UI components, neatly categorized for easier integration:

• Scaffold: A basic layout wrapper for a complete page.
• Container: A container component that adds padding and centers content.
• Row: A flex container for horizontal layout.
• Column: A flex container for vertical layout.
• SizedBox: A simple box to add fixed spacing.
• Padding: A component to add padding around its children.
• Opacity: Control the opacity of your children.
• GestureDetector: Listen for touch events.
• Positioned: Position an element within a parent container.
• PositionedFill: Position an element to fill its parent.
• SingleChildScrollView: A scrollable view for a single child.
• ListView: A scrolling container for a list of items.
• ListViewBuilder: Dynamically builds list items.
• ListViewSeparated: A list with separated items.
• GridView / GridViewBuilder / GridViewCount: Various grid layouts.
• PageView / PageViewBuilder / PageViewCustom: Swipeable page views.
• NestedScrollView: A scroll view supporting nested elements.
• CustomScrollView: For custom scrollable layouts.
• LimitedBox: Limits the size when unconstrained.
• AnimatedPositioned / AnimatedPositionedDirectional: Animate positioning.

• TextField: User input field.
• Switch: Toggle between two states.
• TabBar: Navigate between views.
• OutlinedButton: Button with an outlined border.
• ElevatedButton: Button with a shadow.
• CupertinoButton: Button following Apple’s design.

• Carousel: Display a collection of items in a carousel.
• RotatedBox: Rotate its child.
• Rotation: Apply rotation transformations.
• AnimatedOpacity: Animate opacity changes.
• AnimatedContainer: Animate size, color, and more.
• AnimatedRotation: Animated rotation effect.
• AnimatedScale: Animate scaling.
• AnimatedSlide: Animate sliding.
• AnimatedFractionallySizedBox: Animate resizing based on a fraction of its container.
• FittedBox: Scale and position its child.
• Transform, TransformRotate, TransformScale, TransformTranslate: Apply transformations.
• AspectRatio: Enforce a specific aspect ratio.
• FractionallySizedBox: Size its child based on a fraction.

• Divider: A horizontal line.
• ClipRRect: Clip with rounded corners.
• Center: Center content.
• Align: Align content within a container.
• CircularProgressIndicator: Spinner for loading.
• CircleAvatar: Circular avatar image.
• Reorderable: Reorder children.
• RichText: Display styled text (now with extra style options).
• Spacer: Flexible space.
• Expanded: Expand to fill available space.

• AppBar: Top app bar for navigation and actions (excluding buttons).

Integrate FlutterSwiftUI using Swift Package Manager by adding the following dependency to your Package.swift:

dependencies: [
    .package(url: "https://github.com/miracle101000/FlutterSwiftUI.git", from: "1.0.0")
]

Then import it in your Swift files:

import FlutterSwiftUI

struct ListViewExample: View {
    var body: some View {
        ListView(
            scrollDirection: .horizontal,
            physics: .clamped,
            reverse: true
        ) {
            ForEach(1...10, id: \.self) { index in
                Text("Item \(index)")
                    .padding()
                    .background(Color.blue.opacity(0.3))
                    .cornerRadius(8)
            }
        }
        .frame(height: 150)
        .padding()
    }
}

struct GridViewExample: View {
    @StateObject var scrollController = GridScrollController()

    var body: some View {
        VStack(spacing: 20) {
            Text("Vertical Grid (3 columns)")
                .font(.headline)
            
            GridViewBuilder(
                itemCount: 10,
                itemBuilder: { index in
                    Text("Item \(index + 1)")
                        .frame(maxWidth: .infinity, maxHeight: .infinity)
                        .background(Color.red.opacity(0.3))
                },
                scrollDirection: .vertical,
                physics: .auto,
                crossAxisCount: 3,
                mainAxisExtent: 100,
                spacing: 10,
                scrollController: scrollController
            )
            .frame(height: 400)
            .border(Color.gray)
            
            Button("Scroll to Top") {
                scrollController.scrollToTop?()
            }
        }
        .padding()
    }
}

struct ImageWidgetExample: View {
    var body: some View {
        ImageWidget(
            src: "https://example.com/image.jpg",
            alt: "Example Image",
            borderRadius: .init(all: 12),
            loadingPlaceholder: AnyView(Text("Loading...")),
            errorPlaceholder: AnyView(Text("Failed to load image")),
            width: 300,
            height: 200,
            boxFit: .cover
        )
        .padding()
    }
}

struct LimitedBoxExample: View {
    var body: some View {
        LimitedBox(maxWidth: 300, maxHeight: 200) {
            Text("This content is inside a box with limited size.")
                .padding()
                .border(Color.black)
        }
        .padding()
    }
}

struct IgnorePointerExample: View {
    var body: some View {
        IgnorePointer(shouldIgnore: true) {
            Rectangle()
                .fill(Color.blue.opacity(0.3))
                .frame(width: 200, height: 200)
        }
        .padding()
    }
}

Contributions to FlutterSwiftUI are welcome! Please open issues or submit pull requests for bug fixes, enhancements, or new components. Follow our contribution guidelines for details.

This project is licensed under the MIT License. See the LICENSE file for details.