Giter Club home page Giter Club logo

rxtheme's Introduction

RxTheme

Build Status Version Carthage compatible License Platform

Manual

Define theme service

import RxTheme

protocol Theme {
    var backgroundColor: UIColor { get }
    var textColor: UIColor { get }
}

struct LightTheme: Theme {
    let backgroundColor = .white
    let textColor = .black
}

struct DarkTheme: Theme {
    let backgroundColor = .black
    let textColor = .white
}

enum ThemeType: ThemeProvider {
    case light, dark
    var associatedObject: Theme {
        switch self {
        case .light:
            return LightTheme()
        case .dark:
            return DarkTheme()
        }
    }
}

let themeService = ThemeType.service(initial: .light)

Apply theme to UI

// Bind stream to a single attribute
// In the way, RxTheme would automatically manage the lifecycle of the binded stream 
view.theme.backgroundColor = themeService.attrStream { $0.backgroundColor }

// Or bind a bunch of attributes, add them to a disposeBag
themeService.rx
    .bind({ $0.textColor }, to: label1.rx.textColor, label2.rx.textColor)
    .bind({ $0.backgroundColor }, to: view.rx.backgroundColor)
    .disposed(by: disposeBag)

All streams generated by ThemeService has share(1)

Switch themes

themeService.switch(.dark)
// When this is triggered by some signal, you can use:
someSignal.bind(to: themeService.switcher)

Other APIs

// Current theme type
themeService.type
// Current theme attributes
themeService.attrs
// Theme type stream
themeService.typeStream
// Theme attributes stream
themeService.attrsStream

Binder presets

CALayer
  • backgroundColor
  • borderWidth
  • borderColor
  • shadowColor
CAShapeLayer
  • strokeColor
  • fillColor
UIActivityIndicatorView
  • style
UIBarButtonItem
  • tintColor
UIButton
  • titleColor
UILabel
  • font
  • textColor
  • highlightedTextColor
  • shadowColor
UINavigationBar
  • barStyle
  • barTintColor
  • titleTextAttributes
UIPageControl
  • pageIndicatorTintColor
  • currentPageIndicatorTintColor
UIProgressView
  • progressTintColor
  • trackTintColor
UISearchBar
  • barStyle
  • barTintColor
  • keyboardAppearance
UISlider
  • thumbTintColor
  • minimumTrackTintColor
  • maximumTrackTintColor
UISwitch
  • onTintColor
  • thumbTintColor
UITabBar
  • barStyle
  • barTintColor
UITableView
  • separatorColor
UITAbleViewCell
  • selectionStyle
UITextField
  • font
  • textColor
  • keyboardAppearance
UITextView
  • font
  • textColor
  • keyboardAppearance
UIToolbar
  • barStyle
  • barTintColor
UIView
  • tintColor

Extend binders in your codebase

Because RxTheme uses Binder<T> from RxCocoa, any Binder defined in RxCocoa could be used here.

This also makes the lib super easy to extend in your codebase, here is an example

extension Reactive where Base: UIView {
    var borderColor: Binder<UIColor?> {
        return Binder(self.base) { view, color in
            view.layer.borderColor = color?.cgColor
        }
    }
}

if you also want to use the sugar view.theme.borderColor, you have to write another extension:

extension ThemeProxy where Base: UIView {
    var borderColor: Observable<UIColor?> {
        get { return .empty() }
        set {
            let disposable = newValue
                .takeUntil(base.rx.deallocating)
                .observeOn(MainScheduler.instance)
                .bind(to: base.rx.borderColor)
            hold(disposable, for: "borderColor")
        }
    }
}

Extend binders in the lib

Open codegen/rx_exts.yml and codegen/theme_exts.yml, add class, attributes and supported os.

UILabel:
  attrs:
    font: UIFont
    textColor: UIColor?
    highlightedTextColor: UIColor?
    shadowColor: UIColor?
  os: [iOS, tvOS]

then run codegen script

// make sure you have python3 and pipenv installed
$ pipenv install
$ pipenv run python -m codegen update-exts

If you think it's commonly used, please send us a PR.

Examples

You can run the example project, clone the repo, run pod install from the Example directory first, and open up the workspace file.

If you prefer, there is also a nice video tutorial by @rebeloper.

Installation

Cocoapods

pod 'RxTheme', '~> 4.0'

Carthage

github "RxSwiftCommunity/RxTheme" ~> 4.0.0

Author

duan, [email protected]

License

RxTheme is available under the MIT license. See the LICENSE file for more info.

rxtheme's People

Contributors

wddwycc avatar cozzin avatar

Watchers

James Cloos 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.