GithubHelp home page GithubHelp logo

xuzhr / acarousel Goto Github PK

View Code? Open in Web Editor NEW

This project forked from jwautumn/acarousel

0.0 0.0 0.0 16.19 MB

A carousel view for SwiftUI | SwiftUI 旋转木马效果

License: MIT License

Swift 100.00%

acarousel's Introduction

ACarousel

A carousel view for SwiftUI

中文文档

   

Table of Contents

Requirements

  • iOS 13.0+ / macOS 10.15+ / tvOS 13.0+
  • Xcode 11.0+
  • Swift 5.1+

Install

Swift Package Manager

Open Xcode, go to File -> Swift Packages -> Add Package Dependency and enter https://github.com/JWAutumn/ACarousel

You can also add ACarousel as a dependency to your Package.swift:

dependencies: [
  .package(url: "https://github.com/JWAutumn/ACarousel", from: "0.2.0")
]

Manually

Download and open the project, drag the ACarousel.swift file into your own project.

Usage

  • Basic use: The parameters of ACarousel have default values, so you can simply pass in the data source and eat it ~
struct Item: Identifiable {
    let id = UUID()
    let image: Image
}

let roles = ["Luffy", "Zoro", "Sanji", "Nami", "Usopp", "Chopper", "Robin", "Franky", "Brook"]

struct ContentView: View {
    
    let items: [Item] = roles.map { Item(image: Image($0)) }
    
    var body: some View {
        ACarousel(items) { item in
            item.image
                .resizable()
                .scaledToFill()
                .frame(height: 300)
                .cornerRadius(30)
        }
        .frame(height: 300)
    }
}

or:

...
var body: some View {
    ACarousel(roles, id: \.self) { name in
        Image(name)
            .resizable()
            .scaledToFill()
            .frame(height: 300)
            .cornerRadius(30)
    }
    .frame(height: 300)
}
...
  • Customize configuration: You can configure the corresponding parameters to customize the display style according to your needs.
 /// ...

struct ContentView: View {
    
    let items: [Item] = roles.map { Item(image: Image($0)) }
    
    var body: some View {
        ACarousel(items,
                  spacing: 10,
                  headspace: 10,
                  sidesScaling: 0.7,
                  isWrap: true,
                  autoScroll: .active(2)) { item in
            item.image
                .resizable()
                .scaledToFill()
                .frame(height: 300)
                .cornerRadius(30)
        }
        .frame(height: 300)
    }
}

Example

Download and open ACarouselDemo -> ACarouselDemo.xcodeproj, run and view.

Maintainers

@JWAutumn@Underthestars-zhy@Alexander Chapliuk@thitran-incepit.

Contributing

Feel free to dive in! Open an issue or submit PRs.

License

MIT © JWAutumn

acarousel's People

Contributors

jwautumn avatar krin-san avatar theauttom avatar thitran-incepit avatar underthestars-zhy avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.