您是否正在寻找一个以层级方式显示比赛对阵的软件包 👀？那么您来对地方了 👨‍🏭👏。

TournamentBracketView 🚀

这是一个以美观的对阵表视图显示比赛对阵的软件包。完全使用 SwiftUI 框架开发。

为什么选择这个软件包？

Xcode 包依赖

使用以下链接将 TournamentBracketView 作为包依赖项添加到 Xcode 项目中

https://github.com/manisrini/TournamentBracketSUI

平台支持

配置

TournamentBracketView 是一个生成对阵表视图的 swiftUI 视图。 它需要三个参数。

TournamentBracketView(viewModel : TournamentBracketViewModel,showTabSwitch : Bool,theme: TournamentBracketTheme)

参数简述

viewModel : TournamentBracketViewModel

它需要 tournament 参数。 以下是显示的模型。

public struct Tournament{
    let rounds : [Round]
}

public struct Round {
    let id : Int
    let matchUps : [Matchup]
}

public struct Matchup  {
    let id : Int
    let team1 : Team?
    let team2 : Team?
    let date : String
    let additionalInfo : String
}

public struct Team{
    let id : Int
    @Capitalised var name : String
    let image : UIImage?
    let points : Int
}

showTabSwitch: Bool

一个布尔值，用于确定是否显示标签。

theme: TournamentBracketTheme

用于自定义字体系列和大小。

示例

以下是一个示例，用于显示 16 强的比赛对阵。 对于每个连续的轮次，对阵数组计数必须按递减顺序（2 的幂），才能生成完美的对阵表视图。

例如，第一轮比赛对阵计数 - 8，第二轮比赛对阵计数 - 4，第三轮比赛对阵计数 - 2，第四轮比赛对阵计数 - 1

    TournamentBracketView(viewModel: TournamentBracketViewModel(tournament: Tournament(
        rounds: [
            Round(id: 4, matchUps: [
                Matchup(id: 1, team1: Team(id: 1, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 2, name: "netherland", image: UIImage(named: "Netherland",in: .module,compatibleWith: nil), points: 3)),
                
                Matchup(id: 2, team1: Team(id: 3, name: "india", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 3), team2: Team(id: 4, name: "argentina", image: UIImage(named: "Argentina",in: .module,compatibleWith: nil), points: 4)),
                
                Matchup(id: 3, team1: Team(id: 5, name: "australia", image: UIImage(named: "Australia",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 6, name: "spain", image: UIImage(named: "Spain",in: .module,compatibleWith: nil), points: 3)),
                
                Matchup(id: 4, team1: Team(id: 7, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 8, name: "netherland", image: UIImage(named: "Netherland",in: .module,compatibleWith: nil), points: 3)),
                
                Matchup(id: 5, team1: Team(id: 9, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 10, name: "India", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 3)),
                
                Matchup(id: 6, team1: Team(id: 11, name: "india", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 5), team2: Team(id: 12, name: "argentina", image: UIImage(named: "Argentina",in: .module,compatibleWith: nil), points: 4)),
                
                Matchup(id: 7, team1: Team(id: 13, name: "australia", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 14, name: "spain", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 3)),
                
                Matchup(id: 8, team1: Team(id: 15, name: "england", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 16, name: "netherland", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 3))
            ]),
        Round(id: 1, matchUps: [
            Matchup(id: 44, team1: Team(id: 17, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 18, name: "netherland", image: UIImage(named: "Netherland",in: .module,compatibleWith: nil), points: 3)),
            
            Matchup(id: 43, team1: Team(id: 19, name: "india", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 5), team2: Team(id: 20, name: "argentina", image: UIImage(named: "Argentina",in: .module,compatibleWith: nil), points: 4)),
            
            Matchup(id: 34, team1: Team(id: 21, name: "australia", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 22, name: "spain", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 3)),
            
            Matchup(id: 23, team1: Team(id: 23, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id:24, name: "netherland", image: UIImage(named: "Netherland",in: .module,compatibleWith: nil), points: 3))
        ]),
        Round(id: 2, matchUps: [
            Matchup(id: 12, team1: Team(id: 1, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 2, name: "netherland", image: UIImage(named: "Netherland",in: .module,compatibleWith: nil), points: 3)),
            
            Matchup(id: 14, team1: Team(id: 3, name: "india", image: UIImage(named: "India",in: .module,compatibleWith: nil), points: 5), team2: Team(id: 2, name: "argentina", image: UIImage(named: "Argentina",in: .module,compatibleWith: nil), points: 4)),
            
        ]),
        Round(id: 3, matchUps: [
            Matchup(id: 123, team1: Team(id: 25, name: "england", image: UIImage(named: "England",in: .module,compatibleWith: nil), points: 2), team2: Team(id: 26, name: "netherland", image: UIImage(named: "Netherland",in: .module,compatibleWith: nil), points: 3)),
        ])
    ]
    ),showTabSwitch: true,theme: TournamentBracketTheme(fontColor: "232321",font: .Roboto(.Regular, 18))))

演示

BracketDemo.mp4