in Owl/app/src/main/java/com/example/owl/ui/courses/FeaturedCourses.kt [79:176]
fun FeaturedCourse(
course: Course,
selectCourse: (Long) -> Unit,
modifier: Modifier = Modifier
) {
Surface(
modifier = modifier.padding(4.dp),
color = MaterialTheme.colors.surface,
elevation = OwlTheme.elevations.card,
shape = MaterialTheme.shapes.medium
) {
val featuredString = stringResource(id = R.string.featured)
ConstraintLayout(
modifier = Modifier
.clickable(
onClick = { selectCourse(course.id) }
)
.semantics {
contentDescription = featuredString
}
) {
val (image, avatar, subject, name, steps, icon) = createRefs()
NetworkImage(
url = course.thumbUrl,
contentDescription = null,
modifier = Modifier
.aspectRatio(4f / 3f)
.constrainAs(image) {
centerHorizontallyTo(parent)
top.linkTo(parent.top)
}
)
val outlineColor = LocalElevationOverlay.current?.apply(
color = MaterialTheme.colors.surface,
elevation = OwlTheme.elevations.card
) ?: MaterialTheme.colors.surface
OutlinedAvatar(
url = course.instructor,
outlineColor = outlineColor,
modifier = Modifier
.size(38.dp)
.constrainAs(avatar) {
centerHorizontallyTo(parent)
centerAround(image.bottom)
}
)
Text(
text = course.subject.uppercase(Locale.getDefault()),
color = MaterialTheme.colors.primary,
style = MaterialTheme.typography.overline,
modifier = Modifier
.padding(16.dp)
.constrainAs(subject) {
centerHorizontallyTo(parent)
top.linkTo(avatar.bottom)
}
)
Text(
text = course.name,
style = MaterialTheme.typography.subtitle1,
textAlign = TextAlign.Center,
modifier = Modifier
.padding(horizontal = 16.dp)
.constrainAs(name) {
centerHorizontallyTo(parent)
top.linkTo(subject.bottom)
}
)
val center = createGuidelineFromStart(0.5f)
Icon(
imageVector = Icons.Rounded.OndemandVideo,
tint = MaterialTheme.colors.primary,
contentDescription = null,
modifier = Modifier
.size(16.dp)
.constrainAs(icon) {
end.linkTo(center)
centerVerticallyTo(steps)
}
)
Text(
text = course.steps.toString(),
color = MaterialTheme.colors.primary,
style = MaterialTheme.typography.subtitle2,
modifier = Modifier
.padding(
start = 4.dp,
top = 16.dp,
bottom = 16.dp
)
.constrainAs(steps) {
start.linkTo(center)
top.linkTo(name.bottom)
}
)
}
}
}