Skip to content

Commit

Permalink
test accessibility dialog text
Browse files Browse the repository at this point in the history
  • Loading branch information
@AkYML
AkYML committed Jun 19, 2023
1 parent d2c6891 commit 0ff653a
Show file tree
Hide file tree
Showing 16 changed files with 77 additions and 31 deletions.
11 changes: 8 additions & 3 deletions YChartsLib/src/main/java/co/yml/charts/common/components/accessibility/BarInfo.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,26 +15,31 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

/**
* Composable to display each bar item for given bar chart
* @param axisLabelDescription: Axis label description
* @param barDescription: Bar description
* @param titleTextSize: TextUnit title font size
* @param descriptionTextSize: TextUnit description font size
*/
@Composable
fun BarInfo(
axisLabelDescription: String,
barDescription: String, barColor: Color
barDescription: String, barColor: Color,
titleTextSize:TextUnit,
descriptionTextSize:TextUnit
) {
// Merge elements below for accessibility purposes
Row(modifier = Modifier
.padding(start = 10.dp, end = 10.dp)
.clickable { }
.semantics(mergeDescendants = true) {}, verticalAlignment = Alignment.CenterVertically
) {
Text(axisLabelDescription, fontSize = 12.sp)
Text(axisLabelDescription, fontSize = titleTextSize)
Spacer(modifier = Modifier.width(10.dp))
Column(
modifier = Modifier
Expand All @@ -48,7 +53,7 @@ fun BarInfo(
.background(barColor)
.size(20.dp)
)
Text(barDescription, fontSize = 12.sp)
Text(barDescription, fontSize = descriptionTextSize)
}
}
}
Expand Down
11 changes: 8 additions & 3 deletions YChartsLib/src/main/java/co/yml/charts/common/components/accessibility/BubblePointInfo.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

Expand All @@ -23,20 +24,24 @@ import androidx.compose.ui.unit.sp
* @param axisLabelDescription: Axis label description.
* @param pointDescription: Details of each point on the line.
* @param bubbleColor: Color of each bubble.
* @param titleTextSize: TextUnit title font size
* @param descriptionTextSize: TextUnit description font size
*/
@Composable
fun BubblePointInfo(
axisLabelDescription: String,
pointDescription: String,
bubbleColor: Color
bubbleColor: Color,
titleTextSize: TextUnit,
descriptionTextSize: TextUnit
) {
// Merge elements below for accessibility purposes
Row(modifier = Modifier
.padding(start = 10.dp, end = 10.dp)
.clickable { }
.semantics(mergeDescendants = true) {}, verticalAlignment = Alignment.CenterVertically
) {
Text(axisLabelDescription, fontSize = 12.sp)
Text(axisLabelDescription, fontSize = titleTextSize)
Spacer(modifier = Modifier.width(5.dp))
Column(
modifier = Modifier
Expand All @@ -50,7 +55,7 @@ fun BubblePointInfo(
.background(bubbleColor)
.size(20.dp)
)
Text(pointDescription, fontSize = 12.sp)
Text(pointDescription, fontSize = descriptionTextSize)
}
}
}
Expand Down
13 changes: 9 additions & 4 deletions YChartsLib/src/main/java/co/yml/charts/common/components/accessibility/CombinedChartInfo.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import co.yml.charts.ui.barchart.models.GroupBar
Expand All @@ -32,6 +33,8 @@ import co.yml.charts.common.model.Point
* @param axisLabelDescription: Axis label description.
* @param barColorPaletteList: List of each bar colors for a given group bar.
* @param dividerColor: Divider color between each point items.
* @param titleTextSize: TextUnit title font size
* @param descriptionTextSize: TextUnit description font size
*/
@Composable
fun CombinedChartInfo(
Expand All @@ -40,15 +43,17 @@ fun CombinedChartInfo(
groupBar: GroupBar?,
axisLabelDescription: String,
barColorPaletteList: List<Color>,
dividerColor: Color
dividerColor: Color,
titleTextSize: TextUnit,
descriptionTextSize: TextUnit
) {
// Merge elements below for accessibility purposes
Row(modifier = Modifier
.padding(start = 10.dp, end = 10.dp)
.clickable { }
.semantics(mergeDescendants = true) {}, verticalAlignment = Alignment.CenterVertically
) {
Text(axisLabelDescription, fontSize = 12.sp)
Text(axisLabelDescription, fontSize = titleTextSize)
Spacer(modifier = Modifier.width(10.dp))
Column(
modifier = Modifier
Expand All @@ -66,7 +71,7 @@ fun CombinedChartInfo(
)
.size(10.dp)
)
Text(point.description, fontSize = 12.sp)
Text(point.description, fontSize = descriptionTextSize)
}
Spacer(modifier = Modifier.height(5.dp))
}
Expand All @@ -79,7 +84,7 @@ fun CombinedChartInfo(
.background(barColorPaletteList[index])
.size(20.dp)
)
Text(value.description, fontSize = 12.sp)
Text(value.description, fontSize = descriptionTextSize)
}
Spacer(modifier = Modifier.height(5.dp))
}
Expand Down
11 changes: 8 additions & 3 deletions YChartsLib/src/main/java/co/yml/charts/common/components/accessibility/GroupBarInfo.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import co.yml.charts.ui.barchart.models.GroupBar
Expand All @@ -26,20 +27,24 @@ import co.yml.charts.ui.barchart.models.GroupBar
* @param axisLabelDescription: Axis label description.
* @param groupBar: Details of each group bar.
* @param barColorPaletteList: List of each bar colors for a given group bar.
* @param titleTextSize: TextUnit title font size
* @param descriptionTextSize: TextUnit description font size
*/
@Composable
fun GroupBarInfo(
groupBar: GroupBar,
axisLabelDescription: String,
barColorPaletteList: List<Color>
barColorPaletteList: List<Color>,
titleTextSize: TextUnit,
descriptionTextSize: TextUnit
) {
// Merge elements below for accessibility purposes
Row(modifier = Modifier
.padding(start = 10.dp, end = 10.dp)
.clickable { }
.semantics(mergeDescendants = true) {}, verticalAlignment = Alignment.CenterVertically
) {
Text(axisLabelDescription, fontSize = 12.sp)
Text(axisLabelDescription, fontSize =titleTextSize)
Spacer(modifier = Modifier.width(10.dp))
Column(
modifier = Modifier
Expand All @@ -54,7 +59,7 @@ fun GroupBarInfo(
.background(barColorPaletteList[index])
.size(20.dp)
)
Text(value.description, fontSize = 12.sp)
Text(value.description, fontSize = descriptionTextSize)
}
Spacer(modifier = Modifier.height(5.dp))
}
Expand Down
12 changes: 9 additions & 3 deletions YChartsLib/src/main/java/co/yml/charts/common/components/accessibility/LinePointInfo.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

Expand All @@ -23,20 +24,25 @@ import androidx.compose.ui.unit.sp
* @param axisLabelDescription: Axis label description.
* @param pointDescription: Details of each point on the line.
* @param lineColor: Color of each line.
* @param titleTextSize: TextUnit title font size
* @param descriptionTextSize: TextUnit description font size
*
*/
@Composable
fun LinePointInfo(
axisLabelDescription: String,
pointDescription: String,
lineColor: Color
lineColor: Color,
titleTextSize: TextUnit,
descriptionTextSize: TextUnit
) {
// Merge elements below for accessibility purposes
Row(modifier = Modifier
.padding(start = 10.dp, end = 10.dp)
.clickable { }
.semantics(mergeDescendants = true) {}, verticalAlignment = Alignment.CenterVertically
) {
Text(axisLabelDescription, fontSize = 12.sp)
Text(axisLabelDescription, fontSize = titleTextSize)
Spacer(modifier = Modifier.width(5.dp))
Column(
modifier = Modifier
Expand All @@ -50,7 +56,7 @@ fun LinePointInfo(
.background(lineColor)
.size(20.dp)
)
Text(pointDescription, fontSize = 12.sp)
Text(pointDescription, fontSize = descriptionTextSize)
}
}
}
Expand Down
6 changes: 4 additions & 2 deletions YChartsLib/src/main/java/co/yml/charts/common/components/accessibility/SliceInfo.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import co.yml.charts.ui.piechart.models.PieChartData
Expand All @@ -20,9 +21,10 @@ import co.yml.charts.ui.piechart.models.PieChartData
* Composable to display each slice for a given pie chart.
* @param slice: Details of each slice in pie/ donut chart.
* @param slicePercentage: Percentage of each slice.
* @param textSize: TextUnit text font size
*/
@Composable
fun SliceInfo(slice: PieChartData.Slice, slicePercentage: Int) {
fun SliceInfo(slice: PieChartData.Slice, slicePercentage: Int, textSize: TextUnit) {
// Merge elements below for accessibility purposes
Row(modifier = Modifier
.clickable { }
Expand All @@ -40,7 +42,7 @@ fun SliceInfo(slice: PieChartData.Slice, slicePercentage: Int) {
.weight(1f)
.padding(top = 10.dp, bottom = 10.dp)
) {
Text(slice.sliceDescription(slicePercentage), fontSize = 12.sp)
Text(slice.sliceDescription(slicePercentage), fontSize = textSize)
}
}
}
9 changes: 6 additions & 3 deletions YChartsLib/src/main/java/co/yml/charts/common/model/AccessibilityConfig.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,14 +15,17 @@ import co.yml.charts.common.utils.ChartConstants
* @param popUpTopRightButtonDescription: Content description of the button visible on the accessibility popUp at the top right.
* @param dividerColor: Defines the color for the divider used in the accessibility popUp
* @param dividerThickness: Defines the thickness for the divider in Dp used in the accessibility popUp
* @param titleTextSize: Defines the font-size of titles used in the accessibility popUp
* @param descriptionTextSize: Defines the font-size of descriptions used in the accessibility popUp
*/
data class AccessibilityConfig(
val chartDescription: String = ChartConstants.CHART_DESCRIPTION,
val descriptionTextSize: TextUnit = 14.sp,
val shouldHandleBackWhenTalkBackPopUpShown: Boolean = true,
val popUpTopRightButtonTitle: String = ChartConstants.POPUP_TOP_RIGHT_BUTTON_TITLE,
val popUpTopRightButtonDescription: String = ChartConstants.POPUP_TOP_RIGHT_BUTTON_DESCRIPTION,
val dividerColor: Color = Color.Gray,
val dividerThickness: Dp = 2.dp
)
val dividerThickness: Dp = 2.dp,
val titleTextSize: TextUnit = 14.sp,
val descriptionTextSize: TextUnit = 14.sp,
)

4 changes: 3 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/barchart/BarChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,9 @@ fun BarChart(modifier: Modifier, barChartData: BarChartData) {
)
},
chartData[index].description,
chartData[index].color
chartData[index].color,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)
ItemDivider(
thickness = accessibilityConfig.dividerThickness,
Expand Down
4 changes: 3 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/barchart/GroupBarChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -304,7 +304,9 @@ fun GroupBarChart(modifier: Modifier, groupBarChartData: GroupBarChartData) {
xAxisData.axisLabelDescription(
xAxisData.labelData(index)
),
barPlotData.barColorPaletteList
barPlotData.barColorPaletteList,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)
ItemDivider(
thickness = accessibilityConfig.dividerThickness,
Expand Down
4 changes: 3 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/barchart/StackedBarChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -311,7 +311,9 @@ fun StackedBarChart(
xAxisData.axisLabelDescription(
xAxisData.labelData(index)
),
barPlotData.barColorPaletteList
barPlotData.barColorPaletteList,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)
ItemDivider(
thickness = accessibilityConfig.dividerThickness,
Expand Down
5 changes: 3 additions & 2 deletions YChartsLib/src/main/java/co/yml/charts/ui/bubblechart/BubbleChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -251,8 +251,9 @@ fun BubbleChart(modifier: Modifier, bubbleChartData: BubbleChartData) {
)
),
bubbles[index].center.description,
bubbles[index].bubbleStyle.solidColor
?: bubbles[index].bubbleStyle.gradientColors.first()
bubbles[index].bubbleStyle.solidColor,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)
ItemDivider(
thickness = accessibilityConfig.dividerThickness,
Expand Down
4 changes: 3 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/combinedchart/CombinedChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -388,7 +388,9 @@ fun CombinedChart(modifier: Modifier, combinedChartData: CombinedChartData) {
xAxisData.labelData(index)
),
barColorPaletteList = barPlotData.barColorPaletteList,
dividerColor = accessibilityConfig.dividerColor
dividerColor = accessibilityConfig.dividerColor,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)
ItemDivider(
thickness = accessibilityConfig.dividerThickness,
Expand Down
4 changes: 3 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/linechart/LineChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -256,7 +256,9 @@ fun LineChart(modifier: Modifier, lineChartData: LineChartData) {
)
),
point.description,
linePlotData.lines[lineIndex].lineStyle.color
linePlotData.lines[lineIndex].lineStyle.color,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)

ItemDivider(
Expand Down
3 changes: 2 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/piechart/charts/DonutPieChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -252,7 +252,8 @@ fun DonutPieChart(
items(pieChartData.slices.size) { index ->
SliceInfo(
pieChartData.slices[index],
proportions[index].roundToInt()
proportions[index].roundToInt(),
accessibilityConfig.descriptionTextSize
)
}
}
Expand Down
3 changes: 2 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/piechart/charts/PieChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -245,7 +245,8 @@ fun PieChart(
LazyColumn {
items(pieChartData.slices.size) { index ->
SliceInfo(
pieChartData.slices[index], proportions[index].roundToInt()
pieChartData.slices[index], proportions[index].roundToInt(),
accessibilityConfig.descriptionTextSize
)
}
}
Expand Down
4 changes: 3 additions & 1 deletion YChartsLib/src/main/java/co/yml/charts/ui/wavechart/WaveChart.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -256,7 +256,9 @@ fun WaveChart(modifier: Modifier, waveChartData: WaveChartData) {
),
linePoints?.get(index)?.description ?: "",
wavePlotData.lines.firstOrNull()?.waveStyle?.color
?: Color.Transparent
?: Color.Transparent,
accessibilityConfig.titleTextSize,
accessibilityConfig.descriptionTextSize
)
ItemDivider(
thickness = accessibilityConfig.dividerThickness,
Expand Down

0 comments on commit 0ff653a

Please sign in to comment.