Skip to main content
Version: 1.16.0-alpha.1

Hosts

A host is the top-level composable function or view for a chart. Hosts act as entry points—they accept implementations or subclasses of Chart, ChartEntryModel or ChartModelProducer, and AxisRenderer, among other things. They also house options related to scrolling, zooming, and other Chart-independent matters.

Notably, a host accepts an instance of HorizontalLayout, which lets you switch between a segmented style and a full-width one. You can also override the x step, which is the difference between the x values of neighboring major entries and defaults to the GCD of all the x values. For charts with dynamic data, placeholders can be added. These are shown when no ChartEntryModel is available.

For Jetpack Compose, the host is the Chart composable function. It is interacted with via its parameters. In the view system, there are two hosts—ChartView and ComposedChartView—both of which extend BaseChartView. They are interacted with via their public members and XML attributes.

note

Across this wiki, in the context of the view system, we’ll be mentioning fields and functions of BaseChartView, so keep in mind that you can access all those fields and functions via ChartView and ComposedChartView.

XML attributes

Views

BaseChartView

ChartView

ChartView has all the attributes of BaseChartView, plus the following:

  • chart (column, stackedColumn, or line): the chart type

ComposedChartView

ComposedChartView has all the attributes of BaseChartView, plus the following:

  • charts (pipe-separated combination of column, stackedColumn, and line): the chart types

Attribute sets

Axis

  • axisLineStyle (LineComponentStyle): the style of the axis line
  • axisGuidelineStyle (LineComponentStyle): the style of axis guidelines
  • axisTickStyle (LineComponentStyle): the style of axis ticks
  • axisLabelStyle (TextComponentStyle): the style of axis labels
  • axisTickLength (dimension): the length of axis ticks
  • axisLabelBackground (color or Shape): the background for axis labels
  • verticalAxisHorizontalLabelPosition (outside or inside): the horizontal position of the labels on this axis if it is vertical
  • verticalAxisVerticalLabelPosition (top, center, or bottom): the vertical position of the labels on this axis is if it vertical
  • labelRotationDegrees (floating-point number): the rotation of axis labels in degrees
  • title (string or reference): the axis title
  • showTitle (boolean or reference): whether to display the axis title
  • titleStyle (TextComponentStyle): the style of the axis title
  • horizontalAxisLabelSpacing (integer): the label spacing for this axis if it is horizontal
  • horizontalAxisLabelOffset (integer): the label offset for this axis if it is horizontal
  • showAxisLine (boolean): whether to display the axis line
  • showGuideline (boolean): whether to display guidelines
  • showTick (boolean): whether to display ticks
  • shiftExtremeHorizontalAxisTicks (boolean): equivalent to the shiftExtremeTicks parameter of AxisItemPlacer.Horizontal.default
  • addExtremeHorizontalAxisLabelPadding (boolean): equivalent to the addExtremeLabel parameter of AxisItemPlacer.Horizontal.default
  • shiftTopVerticalAxisLines (boolean): equivalent to the shiftTopLines parameter of AxisItemPlacer.Vertical.default
  • maxVerticalAxisItemCount (integer): equivalent to the maxItemCount parameter of AxisItemPlacer.Vertical.default

ComponentStyle

  • color (color): the background color
  • shapeStyle (Shape): the shape style
  • strokeColor (color): the stroke color
  • strokeWidth (dimension): the stroke width
  • overlayingComponentStyle (ComponentStyle): a component with which to overlay this component
  • overlayingComponentPadding (dimension): the padding between this component and the component with which it is overlaid

ColumnChartStyle

  • column1Style (ComponentStyle): the style for columns whose index in a column collection is 3k (k ∈ N)
  • column2Style (ComponentStyle): the style for columns whose index in a column collection is 1 + 3k (k ∈ N)
  • column3Style (ComponentStyle): the style for columns whose index in a column collection is 2 + 3k (k ∈ N)
  • columnOuterSpacing (dimension): the distance between neighboring column collections
  • columnInnerSpacing (dimension): the distance between neighboring grouped columns
  • showDataLabels (boolean): whether to show data labels
  • dataLabelStyle (TextComponentStyle): the style of data labels
  • dataLabelVerticalPosition (top, center, or bottom): the vertical position of each data label relative to the top edge of its respective column
  • dataLabelRotationDegrees (floating-point number): the rotation of data labels in degrees

TextComponentStyle

  • labelColor (color): the text color
  • backgroundStyle (ComponentStyle): the background for the label
  • android:padding (dimension): the padding for each edge of the label
  • android:padding* (dimension): the padding for a specific edge or edge pair of the label
  • android:fontFamily (sans-serif, sans-serif-*, or @font reference): the font family
  • android:textFontWeight (integer between 100 and 900): the font weight
  • android:fontStyle (normal or italic): the font style
  • android:textSize (dimension): the text size
  • android:ellipsize (start, end, middle, none, or marquee): the text truncation behavior
  • typeface (normal, sans, serif, or monospace): the typeface
  • margin (dimension): the size of all four margins
  • margin* (dimension): the size of a specific margin or margin pair
  • textAlignment (normal, center, or opposite): the text alignment

LineChartStyle

  • line1Spec (LineSpec): the style for lines whose index in the list of lines in a line chart is 3k (k ∈ N)
  • line2Spec (LineSpec): the style for lines whose index in the list of lines in a line chart is 1 + 3k (k ∈ N)
  • line3Spec (LineSpec): the style for lines whose index in the list of lines in a line chart is 2 + 3k (k ∈ N)
  • spacing (dimension): the point spacing

LineComponentStyle

  • color (color): the background color
  • thickness (dimension): the line thickness
  • shapeStyle (Shape): the shape of the line
  • strokeColor (color): the stroke color
  • strokeWidth (dimension): the stroke width

LineSpec

  • color (color): the line color
  • gradientTopColor (color): the top color of the vertical background gradient
  • gradientBottomColor (color): the bottom color of the vertical background gradient
  • pointSize (dimension): the point size
  • lineThickness (dimension): the thickness of the line
  • pointStyle (ComponentStyle): the style of points
  • cubicStrength (fraction): the strength of the cubic bezier curve between each key point on the line
  • showDataLabels (boolean): whether to show data labels
  • dataLabelStyle (TextComponentStyle): the style of data labels
  • dataLabelVerticalPosition (top, center, or bottom): the vertical position of each data label relative to its respective point on the line
  • dataLabelRotationDegrees (floating-point number): the rotation of data labels in degrees

Shape

  • cornerSize (dimension or fraction): the corner size
  • cornerTreatment (rounded or cut): the corner style
  • topStartCornerSize (dimension or fraction): the size of the top-start corner
  • topEndCornerSize (dimension or fraction): the size of the top-end corner
  • bottomStartCornerSize (dimension or fraction): the size of the bottom-start corner
  • bottomEndCornerSize (dimension or faction): the size of the bottom-end corner
  • dashLength (dimension): the dash length (0 means no dashes)
  • dashGapLength (dimension): the dash gap length (0 means no dashes)