Android & Compose: предварительный просмотр камеры в макету пользовательского интерфейса ⇐ Android

[Anonymous]

Я хочу использовать только квадратный урожай изображения из датчика, поэтому я хочу иметь квадратный предварительный просмотр в пользовательском интерфейсе, другие элементы пользовательского интерфейса должны быть размещены за пределами предварительного просмотра. Пользовательский интерфейс построен с использованием JetPack Compose. Но каким -то образом я получаю предварительный просмотр, похожий на прямоугольник 3: 4, а предварительный просмотр перекрывается с другими элементами пользовательского интерфейса, которые расположены, как и ожидалось для квадратного предварительного просмотра.
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContent {
MyApplicationTheme {
Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
Content(
modifier = Modifier.padding(innerPadding)
)
}
}
}
}
}

@Composable
fun CameraPreview()
{
val previewH = (LocalConfiguration.current.screenWidthDp).dp
fun startCamera(context: Context,
previewView: PreviewView) {
val cameraProviderFuture = ProcessCameraProvider.getInstance(context)

cameraProviderFuture.addListener({
val cameraProvider: ProcessCameraProvider = cameraProviderFuture.get()

// CameraSelector for back camera
val cameraSelector = CameraSelector.Builder()
.requireLensFacing(CameraSelector.LENS_FACING_BACK)
.build()

// Set up Preview use case
val preview = Preview.Builder().build().also {
it.surfaceProvider = previewView.surfaceProvider
}
try {
// Unbind all use cases before rebinding
cameraProvider.unbindAll()

val viewPort = ViewPort.Builder(Rational(1,1), Surface.ROTATION_0).
setScaleType(ViewPort.FILL_CENTER).build()
val useGrp = UseCaseGroup.Builder().
addUseCase(preview).
addUseCase(ImageAnalysis.Builder().build()).
setViewPort(viewPort).build()
// Bind the camera to the lifecycle and the Preview use case
cameraProvider.bindToLifecycle(context as LifecycleOwner,
cameraSelector, useGrp)
} catch (exc: Exception) {
Log.e("CameraXApp", "Use case binding failed", exc)
}
}, ContextCompat.getMainExecutor(context))
}

Box(modifier = Modifier.fillMaxWidth().height(previewH))
{
AndroidView(
modifier = Modifier.fillMaxSize()
.onGloballyPositioned { c ->
Log.i("PREVIEW", "Androview size: ${c.size}")
}
,
factory = { context ->
val screenWidth = Resources.getSystem().displayMetrics.widthPixels
val previewView = PreviewView(context).apply {
scaleType = PreviewView.ScaleType.FILL_CENTER
layoutParams = ViewGroup.LayoutParams(
screenWidth,
screenWidth
)
}
//focusFactory = previewView.meteringPointFactory
startCamera(context, previewView)
previewView
}
)
}
}

@Composable
fun Content(modifier: Modifier = Modifier)
{
val ctx = LocalContext.current
val needPermission = remember {
mutableStateOf(ContextCompat.checkSelfPermission(ctx, Manifest.permission.CAMERA) !=
PackageManager.PERMISSION_GRANTED)}
val CAMERA_PERMISSION_REQUEST_CODE = 101
@Composable
fun PermissionRequestUI() {
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text("Camera permission is required to use this feature.")
Button(onClick = { ActivityCompat.requestPermissions(
ctx as Activity,
arrayOf(Manifest.permission.CAMERA),
CAMERA_PERMISSION_REQUEST_CODE
)
needPermission.value = false}) {
Text("Grant Permission")
}
}
}

if(needPermission.value)
{
PermissionRequestUI()
}
else {
Column(modifier = modifier)
{
CameraPreview()
Text("ABYR")
Text("VALG")
Text("qwert")
Text("zxcv")
}
}
}



Подробнее здесь: https://stackoverflow.com/questions/796 ... -ui-layout