Chart theme

Chart theme

Now you can set your own dark and light theme colors for chart.

To set your own values for chart theme you can parse json file to Theme.self object or just provide bundles for your paletteDark.json and/or paletteLight.json :

// Example: configure custom source
      DXChartApp.resourceManager = DXCResourceManager(darkPaletteBundle: .darkStylePaletteBundle,
                                                lightPaletteBundle: .lightPaletteBundle)

The example of json:

{
  "crossTool": {
    "lineColor": "rgba(255,170,0,1)",
    "labelTextColor": "rgba(255,170,0,1)",
    "labelBoxColor": "rgba(1,1,1,1)"
  },
  "candleTheme": {
    "upColor": "rgba(77,153,83,1)",
    "downColor": "rgba(217,44,64,1)",
    "noneColor": "rgba(255,255,255,1)",
    "upWickColor": "rgba(77,153,83,1)",
    "downWickColor": "rgba(217,44,64,1)",
    "noneWickColor": "rgba(255,255,255,1)"
  },
  "barTheme": {
    "upColor": "rgba(77,153,83,1)",
    "downColor": "rgba(217,44,64,1)",
    "noneColor": "rgba(255,255,255,1)"
  },
  "equivolumeTheme": {
    "upColor": "rgba(77,153,83,1)",
    "downColor": "rgba(217,44,64,1)",
    "noneColor": "rgba(255,255,255,1)"
  },
  "lineTheme": {
    "upColor": "rgba(77,153,83,1)",
    "downColor": "rgba(217,44,64,1)",
    "noneColor": "rgba(255,255,255,1)"
  },
  "chartAreaTheme": {
    "backgroundColor": "rgba(115,115,115,1)",
    "axisColor": "rgba(128,128,128,1)",
    "gridColor": "rgba(40,40,40,1)"
  },
  "scatterPlot": {
    "mainColor": "rgba(255,255,255,1)"
  },
  "areaTheme": {
    "lineColor": "rgba(127,120,214,1)",
    "startColor": "rgba(169,38,251,0.4)",
    "stopColor": "rgba(169,38,251,0.1)"
  },
  "baseLineTheme": {
    "lowerSectionStrokeColor": "rgba(217,44,64,1)",
    "upperSectionStrokeColor": "rgba(77,153,83,1)",
    "lowerSectionFillColor": "rgba(217, 44, 64, 0.07)",
    "upperSectionFillColor": "rgba(77, 153, 83, 0.07)",
  },
  "histogram": {
    "upCap": "rgba(77,153,83,1)",
    "upBottom": "rgba(77,153,83,0.1)",
    "upBright": "rgba(77,153,83,0.4)",
    "downCap": "rgba(217,44,64,1)",
    "downBottom": "rgba(217,44,64,0.1)",
    "downBright": "rgba(217,44,64,0.4)",
    "noneCap": "rgba(255,255,255,1)",
    "noneBottom": "rgba(255,255,255,0.1)",
    "noneBright": "rgba(255,255,255,0.4)"
  },
  "waterMarkTheme": {
    "firstRowColor": "rgba(255,255,255,0.2)",
    "secondRowColor": "rgba(255,255,255,0.2)",
    "thirdRowColor": "rgba(255,255,255,0.2)"
  },
  "highlights": {
    "NO_TRADING": {
      "border": "rgba(107,96,86,1)",
      "background": "transparent",
      "label": "transparent"
    },
    "AFTER_MARKET": {
      "border": "rgba(107,96,86,1)",
      "background": "rgba(255, 170, 0, 0.07)",
      "label": "transparent"
    },
    "PRE_MARKET": {
      "border": "rgba(107,96,86,1)",
      "background": "rgba(38, 251, 149, 0.07)",
      "label": "transparent"
    },
    "REGULAR": {
      "border": "rgba(107,96,86,1)",
      "background": "transparent",
      "label": "transparent"
    }
  },
  "activeCandleTheme": {
    "upColor": "rgba(98,201,93,1)",
    "downColor": "rgba(255,47,47,1)",
    "noneColor": "rgba(255,255,255,1)",
    "upWickColor": "rgba(98,201,93,1)",
    "downWickColor": "rgba(255,47,47,1)",
    "noneWickColor": "rgba(255,255,255,1)"
  },
  "volume": {
    "downCapColor": "rgba(99,30,37,1)",
    "upCapColor": "rgba(42,72,44,1)",
    "noneBarColor": "rgba(255,255,255,0.4)",
    "downBarColor": "rgba(42,72,44,1)",
    "upBarColor": "rgba(99,30,37,1)",
    "noneCapColor": "rgba(255,255,255,0.4)"
  },
  "highLowTheme": {
    "highColor": "rgba(223,222,223,1)",
    "lowColor": "rgba(223,222,223,1)"
  },
  "emptyChartTheme": {
    "noDataColor": "rgba(255, 255, 255, 0.15)"
  },
  "instrumentInfo": {
    "textColor": "#aeb1b3"
  },
  "paneResizer": {
    "lineColor": "rgba(55,55,54,1)",
    "bgColor": "rgba(20,20,19,1)",
    "bgHoverColor": "rgba(55,55,54,0.6)"
  },
  "events": {
    "earnings": {
      "color": "rgba(217,44,64,1)"
    },
    "dividends": {
      "color": "rgba(169,38,251,1)"
    },
    "splits": {
      "color": "rgba(244,187,63,1)"
    },
    "conference-calls": {
      "color": "rgba(48,194,97,1)"
    }
  },
  "secondaryChartTheme": [
    {
      "lineTheme": {
        "bullColor": "rgba(226,61,25,1)",
        "bearColor": "rgba(226,61,25,1)",
        "noneColor": "rgba(226,61,25,1)"
      },
      "areaTheme": {
        "lineColor": "rgba(226,61,25,1)",
        "startColor": "rgba(226,61,25,0.8)",
        "stopColor": "rgba(226,61,25,0)"
      }
    },
    {
      "lineTheme": {
        "bullColor": "rgba(250,191,64,1)",
        "bearColor": "rgba(250,191,64,1)",
        "noneColor": "rgba(250,191,64,1)"
      },
      "areaTheme": {
        "lineColor": "rgba(250,191,64,1)",
        "startColor": "rgba(250,191,64,0.8)",
        "stopColor": "rgba(250,191,64,0)"
      }
    },
    {
      "lineTheme": {
        "bullColor": "rgba(169,38,251,1)",
        "bearColor": "rgba(169,38,251,1)",
        "noneColor": "rgba(169,38,251,1)"
      },
      "areaTheme": {
        "lineColor": "rgba(169,38,251,1)",
        "startColor": "rgba(169,38,251,0.8)",
        "stopColor": "rgba(169,38,251,0)"
      }
    },
    {
      "lineTheme": {
        "bullColor": "rgba(77,211,240,1)",
        "bearColor": "rgba(77,211,240,1)",
        "noneColor": "rgba(77,211,240,1)"
      },
      "areaTheme": {
        "lineColor": "rgba(77,211,240,1)",
        "startColor": "rgba(77,211,240,0.8)",
        "stopColor": "rgba(77,211,240,0)"
      }
    },
    {
      "lineTheme": {
        "bullColor": "rgba(59,203,91,1)",
        "bearColor": "rgba(59,203,91,1)",
        "noneColor": "rgba(59,203,91,1)"
      },
      "areaTheme": {
        "lineColor": "rgba(59,203,91,1)",
        "startColor": "rgba(59,203,91,0.8)",
        "stopColor": "rgba(59,203,91,0)"
      }
    }
  ],
  "yAxis": {
    "backgroundColor": "rgba(1,1,1,1)",
    "backgroundHoverColor": "rgba(20,20,19,1)",
    "labelBoxColor": "rgba(20,20,19,1)",
    "labelDescriptionFillColor": "rgba(20,20,19,1)",
    "labelTextColor": "rgba(128,128,128,1)",
    "labelInvertedTextColor": "rgba(20,20,19,1)",
    "rectLabelTextColor": "rgba(255,255,255,1)",
    "rectLabelInvertedTextColor": "rgba(20,20,19,1)",
    "zeroPercentLine": "rgba(55,55,54,1)"
  },
  "labels": {
    "lastPrice": {
      "textNegative": "rgba(255,255,255,1)",
      "textPositive": "rgba(255,255,255,1)",
      "textSelected": "rgba(0,0,0,1)",
      "boxNegative": "rgba(217,44,64,1)",
      "boxPositive": "rgba(77,153,83,1)",
      "boxSelected": "rgba(255,255,255,1)"
    },
    "countdownToBarClose": {
      "textNegative": "rgba(255,255,255,1)",
      "textPositive": "rgba(255,255,255,1)",
      "textSelected": "rgba(255,255,255,1)",
      "boxNegative": "rgba(217,44,64,1)",
      "boxPositive": "rgba(77,153,83,1)",
      "boxSelected": "rgba(255,255,255,1)"
    },
    "highLow": {
      "high": {
        "boxColor": "rgba(107,96,86,1)",
        "textColor": "rgba(255,255,255,1)",
        "descriptionText": "High"
      },
      "low": {
        "boxColor": "rgba(107,96,86,1)",
        "textColor": "rgba(255,255,255,1)",
        "descriptionText": "Low"
      }
    },
    "bidAsk": {
      "bid": {
        "boxColor": "rgba(77,153,83,1)",
        "textColor": "rgba(255,255,255,1)",
        "descriptionText": "Bid"
      },
      "ask": {
        "boxColor": "rgba(217,44,64,1)",
        "textColor": "rgba(255,255,255,1)",
        "descriptionText": "Ask"
      }
    },
    "prePostMarket": {
      "post": {
        "boxColor": "rgba(38,251,149,1)",
        "textColor": "rgba(20,20,19,1)",
        "descriptionText": "Post"
      },
      "pre": {
        "boxColor": "rgba(255,170,0,1)",
        "textColor": "rgba(20,20,19,1)",
        "descriptionText": "Pre"
      }
    },
    "prevDayClose": {
      "boxColor": "rgba(107,96,86,1)",
      "textColor": "rgba(255,255,255,1)"
    }
  },
  "xAxis": {
    "backgroundColor": "rgba(1,1,1,1)",
    "labelBoxColor": "rgba(20,20,19,1)",
    "labelTextColor": "rgba(128,128,128,1)"
  },
  "navigationMap": {
    "backgroundColor": "rgba(1,1,1,1)",
    "buttonColor": "rgba(255,255,255,0.1)",
    "buttonArrowColor": "rgba(212,212,211,1)",
    "knotColor": "rgba(255,255,255,0.1)",
    "knotLineColor": "rgba(212,212,211,1)",
    "sliderColor": "rgba(255,255,255,0.08)",
    "knotBorderColor": "#0b0d1a",
    "timeLabelsTextColor": "rgba(128,128,128,1)"
  },
  "drawingsTheme": {
    "points": {
      "defaultKeyPoint": {
        "shape": "circle",
        "radius": 4.5,
        "fillStyle": "rgba(255,170,0,1)",
        "lineWidth": 0,
        "lineColor": "rgba(20,20,19,1)",
        "opacity": 1
      },
      "activeKeyPoint": {
        "shape": "circle",
        "radius": 4.5,
        "fillStyle": "rgba(255,170,0,1)",
        "lineWidth": 0,
        "lineColor": "rgba(20,20,19,1)",
        "opacity": 1
      },
      "defaultHoverKeyPoint": {
        "shape": "circle",
        "radius": 4.5,
        "fillStyle": "rgba(255,170,0,1)",
        "lineWidth": 0,
        "lineColor": "rgba(20,20,19,1)",
        "opacity": 1
      },
      "activeHoverKeyPoint": {
        "shape": "circle",
        "radius": 4.5,
        "fillStyle": "rgba(255,170,0,1)",
        "lineWidth": 0,
        "lineColor": "rgba(20,20,19,1)",
        "opacity": 1
      },
      "addingKeyPoint": {
        "shape": "circle",
        "radius": 4.5,
        "fillStyle": "rgba(255,170,0,1)",
        "lineWidth": 0,
        "lineColor": "rgba(20,20,19,1)",
        "opacity": 1,
        "radiusExtension": 12
      }
    },
    "xAxis": {
      "labelColor": "rgba(255,170,0,1)",
      "highlightColor": "rgba(255,170,0,0.1)"
    },
    "yAxis": {
      "labelColor": "rgba(255,170,0,1)",
      "highlightColor": "rgba(255,170,0,0.1)"
    },
    "textBg": "rgba(20,20,19,0.7)",
    "textColor": "rgba(255,170,0,1)"
  }
}

Example of usage:

      DXCUserDefaultsManager.shared.chartThemeDark = self.parseTheme()
          func parseTheme() -> Theme? {
      guard let url = Bundle.main.url(forResource: "paletteDark", withExtension: "json") else { return nil }
      do {
          let jsonData = try Data(contentsOf: url)
          do {
              let decoder = JSONDecoder()
              let theme = try decoder.decode(Theme.self, from: jsonData)
              return theme
          } catch {
              debugPrint("Error decoding theme from JSON: (error)")
              return nil
          }
      } catch {
          debugPrint("Error loading JSON data from file: (error)")
          return nil
      }
  }