Context:
I need to create a PDF report using PdfDocument() drawn from AndroidView
In order to do this, I have to get a set of views with a consistent representation across devices.
the pages of the report (vertical A4) are within a parent :
BoxWithConstraints(modifier = Modifier.fillMaxSize()) {
and each page have a specific ratio applied to it:
Column(
modifier = Modifier
.size(width = maxWidth, height = maxWidth.times(A4_PAGE_RATIO))
.verticalScroll(rememberScrollState())
) {
here is an extract of the code that generate the view inside the above column:
Column(
modifier = Modifier
.fillMaxSize()
.background(Color.White),
) {
// DISPLAY PDF CONTENT
for (pdfPart in allPdfPartAdapters) {
Box(modifier = Modifier) {
pdfPart.PdfPartPreview(modifier = Modifier)
}
}
}
Of course, the result here is not consistent on different screen size density (text are relatively smaller on large width for instance):
on wide screen like a tablet:
on smaller screen like a phone:
What I have tried so far:
My most successfull attempt has been to scale the content either using modifier.scale or modifier.graphicsLayer to a specific ratio and enforce a requiredWidth on children
Column(
modifier = Modifier
.fillMaxSize()
.background(Color.White),
) {
val ratio = maxWidth/ 300f // here, 300 is just the enforced size of the children
// DISPLAY PDF CONTENT
for (pdfPart in allPdfPartAdapters) {
Box(modifier = Modifier
.graphicsLayer(
scaleX = ratio,
scaleY = ratio,
transformOrigin = TransformOrigin(0f, 0f),
)) {
pdfPart.PdfPartPreview(modifier = Modifier.requiredWidth(width = 300.dp))
}
}
}
Here, one of the issues is that I do not know what the size of the composable in it should be, so i do not know which ratio to apply (the arbitrary 300).
Still, the display is not perfectly consistent:
small width:
bigger width:
My guess for inconsistency here is that BowWithConstraint give the maxwidth constraint and not the real width but using a onGloballyPositioned to retrieve real width (Get height of element Jetpack Compose) was not better.
So how can I scale the whole composable to get a consistent representation among any device width?
Thank you for the time taken to read this question.