مدل‌های سه‌بعدی را در برنامه خود سفارشی کنید

دستگاه‌های XR قابل اجرا
این راهنما به شما کمک می‌کند تا برای این نوع دستگاه‌های XR تجربه ایجاد کنید.
هدست‌های XR
عینک‌های XR سیمی

قبل از سفارشی‌سازی یک مدل سه‌بعدی، ابتدا باید آن را به برنامه خود اضافه کنید . پس از افزودن مدل سه‌بعدی به برنامه خود، می‌توانید با سفارشی‌سازی ظاهر و حرکت مدل سه‌بعدی، تجربه بصری و تعاملی را بهبود بخشید.

برای مثال، می‌توانید انیمیشن‌های glTF تعبیه‌شده را اجرا و کنترل کنید، به گره‌هایی که مدل شما را تشکیل می‌دهند دسترسی پیدا کرده و آنها را جابجا کنید، یا حتی بافت‌های سفارشی را بارگذاری کرده و ویژگی‌های مواد را برای لغو مش‌های داخلی تعریف کنید. این قابلیت‌ها به شما امکان می‌دهند ظاهر و رفتار یک شیء را در زمان اجرا به صورت پویا تغییر دهید.

اشیاء سه‌بعدی در اندروید XR

کیت توسعه نرم‌افزار Jetpack XR از استاندارد باز glTF 2.0 که توسط گروه Khronos برای مدل‌های سه‌بعدی ارائه شده است، پشتیبانی می‌کند و این اشیاء را با تکنیک‌های رندرینگ مبتنی بر فیزیک (PBR) که در استاندارد glTF 2.0 مشخص شده است (همراه با افزونه‌های پشتیبانی‌شده) رندر می‌کند. glTF (فرمت انتقال کتابخانه گرافیکی) یک فرمت فایل استاندارد برای انتقال و بارگذاری صحنه‌ها و مدل‌های سه‌بعدی است. یک مدل glTF از یک ساختار سلسله مراتبی از اجزای داخلی تشکیل شده است.

در اینجا اجزای کلیدی برای درک آورده شده است:

  • گره‌ها : این گره‌ها ساختار و سلسله مراتب مدل را تعریف می‌کنند. هر گره می‌تواند موقعیت، چرخش و مقیاس خاص خود را داشته باشد.
  • مش‌ها (Mesh) : هندسه ساختاری و سه‌بعدی که شکل یک شیء سه‌بعدی را تشکیل می‌دهد.
  • مواد (Materials) : این موارد ظاهر بصری مش‌ها، مانند رنگ، زبری یا نحوه واکنش آنها به نور را تعریف می‌کنند .
  • بافت‌ها : یک فایل تصویری، مانند یک فایل PNG، که می‌توانید آن را روی سطح یک مدل سه‌بعدی اعمال کنید تا الگوها، رنگ، جزئیات یا سایر جلوه‌های بصری سفارشی ایجاد کنید.
  • انیمیشن‌ها : اینها توالی‌ها یا آهنگ‌های انیمیشن از پیش تعریف شده‌ای هستند که شامل تغییراتی در گره‌ها و مش‌های منفرد می‌شوند تا ظاهر حرکت را در طول زمان ایجاد کنند.

در Jetpack Compose برای XR، شما این فایل‌ها را با استفاده از SpatialGltfModel رندر می‌کنید و وضعیت بارگذاری و انیمیشن آن را با استفاده از SpatialGltfModelState پیگیری می‌کنید. برای اطلاعات بیشتر، به افزودن مدل‌های سه‌بعدی به برنامه خود مراجعه کنید.

متحرک‌سازی مدل‌های سه‌بعدی

مدل‌های سه‌بعدی می‌توانند انیمیشن‌های تعبیه‌شده داشته باشند. انیمیشن‌ها به‌طور داخلی از نمونه‌گیرها برای تعریف زمان‌بندی و مقادیر یک حرکت و از کانال‌ها برای اتصال آن حرکات به گره‌ها و مش‌های منفرد استفاده می‌کنند. انیمیشن‌های اسکلتی و انیمیشن‌های متریال که با افزونه‌ی glTF مربوط به KHR_animation_pointer ایجاد می‌شوند، در Jetpack XR SDK پشتیبانی می‌شوند.

با استفاده از Compose برای XR، برای پخش یک انیمیشن، نام آهنگ خاص را از لیست animations مشخص کنید. برای شروع پخش animation.start() استفاده کنید. به صورت اختیاری، می‌توانید سرعت، زمان جستجو و اینکه آیا انیمیشن باید با استفاده از SpatialGltfModelAnimation حلقه بزند یا خیر را مشخص کنید:

val animation = modelState.animations.find { it.name == "Walk" }

animation?.animationState?.let { state ->
    LaunchedEffect(state) {
        Log.i("SpatialGltfModelAnimationSample", "Animation State: $state")
    }
}

DisposableEffect(animation) {
    animation?.loop()
    onDispose {
        animation?.stop()
    }
}

دستکاری گره‌ها: حالت‌ها و چرخش‌ها

برای دستکاری بخش‌های خاصی از یک مدل و تغییر ویژگی‌های آن مانند چرخش یا حالت، باید nodes داخلی مدل glTF را با استفاده از SpatialGltfModelState جستجو کنید.

// Retrieve the list of nodes (individual components/meshes) defined within the glTF model.
val entityNodes = modelState.nodes

// Find a specific node by name to apply modifications, such as material overrides.
val node = entityNodes.find { it.name == "node_name" }

پس از یافتن گره صحیح، می‌توانید localPose آن را تنظیم کنید تا موقعیت سه‌بعدی و چرخش آن نسبت به والد بلافصلش GltfModelNode تغییر کند یا modelPose برای تنظیم موقعیت نسبت به ریشه GltfModelEntity استفاده کنید. به طور مشابه، می‌توانید از localScale/modelScale برای تغییر مقیاس مدل نسبت به والد یا ریشه آن استفاده کنید.

LaunchedEffect(node, degrees) {
    val rotation = Quaternion.fromEulerAngles(degrees, 0f, degrees)
    node?.let {
        it.localPose = Pose(it.localPose.translation, rotation)
    }
}

ویژگی‌های مواد مدل سه‌بعدی خود را سفارشی کنید

شما می‌توانید ویژگی‌های متریال را در طول زمان اجرا تنظیم کنید تا ظاهر یک شیء به صورت پویا بر اساس ورودی کاربر یا وضعیت فعلی برنامه تغییر کند.

در Jetpack XR، کلاس‌های KhronosPbrMaterial و KhronosUnlitMaterial برای ایجاد و دستکاری این متریال‌ها استفاده می‌شوند. همانطور که از نامشان پیداست، KhronosUnlitMaterials بدون نور هستند و تحت تأثیر نورپردازی صحنه قرار نمی‌گیرند. KhronosPbrMaterial به شما امکان می‌دهد طیف وسیع‌تری از ویژگی‌ها، مانند رنگ براق، میزان فلزی یا زبری یک شیء و اینکه آیا نور ساطع می‌کند یا خیر را سفارشی کنید.

برای اطلاعات بیشتر در مورد هر ویژگی پشتیبانی شده و پارامترهای قابل تنظیم در اندروید XR، به مستندات مرجع ما مراجعه کنید. برای درک بهتر این ویژگی‌ها، به واژه‌نامه Khronos مراجعه کنید.

شکل ۱. نمونه‌ای از تغییر رنگ‌های پایه در یک مدل سه‌بعدی.

برای سفارشی‌سازی ویژگی‌های مواد مدل سه‌بعدی خود، ابتدا ماده جدید را با استفاده از KhronosPbrMaterial ایجاد خواهید کرد. باید AlphaMode مناسب را برای ظاهر بصری مورد نظر خود تنظیم کنید:

در مرحله بعد، ویژگی‌هایی را که می‌خواهید تغییر دهید تعریف کنید. این مثال از setBaseColorFactor برای تغییر رنگ پایه مش به بنفش استفاده می‌کند. این روش به یک Vector4 نیاز دارد که در آن مؤلفه‌های x, y, z و w به ترتیب با مقادیر RGBA (قرمز، سبز، آبی و آلفا) مطابقت دارند:

// Maintain a reference to the custom material to avoid re-creating it on every recomposition.
var pbrMaterial by remember { mutableStateOf<KhronosPbrMaterial?>(null) }

// Create and apply the custom material once the session is ready and the target node is available.
LaunchedEffect(node) {
    val material = KhronosPbrMaterial.create(
        session = xrSession,
        alphaMode = AlphaMode.OPAQUE
    ).also {
        pbrMaterial = it
        // Apply a base color factor (RGBA) to change the color of the model.
        it.setBaseColorFactor(
            Vector4(
                x = 0.5f,
                y = 0.0f,
                z = 0.5f,
                w = 1.0f
            )
        )
    }

بارگذاری بافت‌های سفارشی برای مدل سه‌بعدی شما

Texture ) یک تصویر است که می‌توانید آن را روی سطح یک مدل سه‌بعدی اعمال کنید تا رنگ، جزئیات یا سایر اطلاعات سطح را ارائه دهید. رابط برنامه‌نویسی کاربردی (API) بافت Jetpack XR به شما امکان می‌دهد داده‌های تصویری، مانند فایل‌های PNG، را از پوشه /assets/ برنامه خود به صورت غیرهمزمان بارگذاری کنید.

هنگام بارگذاری یک بافت، می‌توانید یک TextureSampler مشخص کنید که نحوه رندر شدن بافت را کنترل می‌کند. این نمونه‌گیر، ویژگی‌های فیلترینگ (برای زمانی که بافت کوچکتر یا بزرگتر از اندازه اصلی خود به نظر می‌رسد) و حالت‌های پوشش (برای مدیریت مختصات خارج از محدوده استاندارد [0, 1] ) را تعریف می‌کند. یک Texture باید به KhronosPbrMaterial اختصاص داده شود تا جلوه بصری روی یک مدل سه‌بعدی داشته باشد.

شکل ۲. نمونه‌ای از تغییر بافت در یک مدل سه‌بعدی.

برای بارگذاری یک بافت سفارشی، ابتدا باید فایل تصویر را در پوشه /assets/ خود ذخیره کنید. به عنوان یک روش بهتر، می‌توانید یک زیرشاخه textures نیز در آن پوشه ایجاد کنید.

بعد از اینکه فایل را در دایرکتوری مناسب ذخیره کردید، با استفاده از Texture API، بافت را ایجاد کنید. در صورت نیاز، می‌توانید یک TextureSampler اختیاری را نیز در اینجا اعمال کنید.

این مثال یک بافت انسداد اعمال می‌کند و قدرت انسداد را تنظیم می‌کند:

LaunchedEffect(node) {
    val material = KhronosPbrMaterial.create(
        session = xrSession,
        alphaMode = AlphaMode.OPAQUE
    ).also {
        pbrMaterial = it

        // Load a texture
        val texture = Texture.create(
            session = xrSession,
            path = Path("textures/texture_name.png")
        )

        // Set the texture and configure occlusion to define how the material surface handles ambient lighting.
        it.setOcclusionTexture(
            texture = texture,
            strength = 1.0f
        )
    }
    node?.setMaterialOverride(
        material = material
    )
}

اعمال متریال و تکسچر به اشیاء سه بعدی

برای اعمال متریال یا بافت جدید، متریال موجود را برای یک گره خاص در گره glTF خود لغو کنید. این کار را با فراخوانی setMaterialOverride انجام دهید:

node?.setMaterialOverride(
    material = material
)

برای حذف متریال‌های تازه ایجاد شده، تابع clearMaterialOverride را روی گره‌ای که قبلاً override شده است فراخوانی کنید. این کار مدل سه‌بعدی شما را به حالت پیش‌فرض خود برمی‌گرداند:

if (removeMaterial) {
    node?.clearMaterialOverride()
}


glTF و لوگوی glTF علائم تجاری گروه Khronos Group Inc. هستند.