Android NDK-এর জন্য Google কার্ডবোর্ডের জন্য কুইকস্টার্ট

আপনার নিজের ভার্চুয়াল রিয়েলিটি (VR) অভিজ্ঞতা তৈরি করতে Android এর জন্য কার্ডবোর্ড SDK কীভাবে ব্যবহার করবেন এই নির্দেশিকা আপনাকে দেখায়৷

আপনি একটি স্মার্টফোনকে একটি VR প্ল্যাটফর্মে পরিণত করতে কার্ডবোর্ড SDK ব্যবহার করতে পারেন৷ একটি স্মার্টফোন স্টেরিওস্কোপিক রেন্ডারিং সহ 3D দৃশ্য প্রদর্শন করতে পারে, ট্র্যাক করতে পারে এবং মাথার নড়াচড়ায় প্রতিক্রিয়া জানাতে পারে এবং ব্যবহারকারী কখন দর্শক বোতাম টিপে তা সনাক্ত করে অ্যাপগুলির সাথে যোগাযোগ করতে পারে।

শুরু করার জন্য, আপনি HelloCardboard ব্যবহার করবেন, একটি ডেমো গেম যা কার্ডবোর্ড SDK-এর মূল বৈশিষ্ট্যগুলি প্রদর্শন করে৷ গেমটিতে, ব্যবহারকারীরা বস্তুগুলি খুঁজে পেতে এবং সংগ্রহ করতে একটি ভার্চুয়াল বিশ্বের চারপাশে তাকান। এটি আপনাকে দেখায় কিভাবে:

  • আপনার উন্নয়ন পরিবেশ সেট আপ করুন
  • ডেমো অ্যাপ ডাউনলোড করুন এবং তৈরি করুন
  • একটি কার্ডবোর্ড ভিউয়ারের কিউআর কোড স্ক্যান করে এর প্যারামিটার সংরক্ষণ করুন
  • ব্যবহারকারীর মাথার গতিবিধি ট্র্যাক করুন
  • প্রতিটি চোখের জন্য সঠিক ভিউ প্রজেকশন ম্যাট্রিক্স সেট করে স্টেরিওস্কোপিক ছবি রেন্ডার করুন

HelloCardboard Android NDK ব্যবহার করে। প্রতিটি দেশীয় পদ্ধতি হল:

  • একটি HelloCardboardApp ক্লাস পদ্ধতিতে অনন্যভাবে আবদ্ধ, বা
  • সেই ক্লাসের একটি উদাহরণ তৈরি বা মুছে দেয়

আপনার উন্নয়ন পরিবেশ সেট আপ করুন

হার্ডওয়্যার প্রয়োজনীয়তা:

সফ্টওয়্যার প্রয়োজনীয়তা:

  • অ্যান্ড্রয়েড স্টুডিও সংস্করণ 2022.1.1 "ইলেকট্রিক ইল" বা উচ্চতর
  • Android SDK 13.0 "Tiramisu" (API লেভেল 33) বা উচ্চতর
  • Android NDK ফ্রেমওয়ার্কের সর্বশেষ সংস্করণ

    ইনস্টল করা SDK পর্যালোচনা বা আপডেট করতে, পছন্দগুলি > চেহারা এবং আচরণে যান৷

    অ্যান্ড্রয়েড স্টুডিওতে সিস্টেম সেটিংস > Android SDK

ডেমো অ্যাপ ডাউনলোড করুন এবং তৈরি করুন

কার্ডবোর্ড SDK প্রতিটি শেডারের জন্য একটি পূর্ব-সংকলিত ভলকান হেডার ফাইল ব্যবহার করে তৈরি করা হয়েছে। স্ক্র্যাচ থেকে হেডার ফাইলগুলি তৈরি করার পদক্ষেপগুলি এখানে পাওয়া যাবে।

  1. GitHub থেকে কার্ডবোর্ড SDK এবং HelloCardboard ডেমো অ্যাপ ক্লোন করতে নিম্নলিখিত কমান্ডটি চালান:

    git clone https://github.com/googlevr/cardboard.git
  2. অ্যান্ড্রয়েড স্টুডিওতে, একটি বিদ্যমান অ্যান্ড্রয়েড স্টুডিও প্রজেক্ট খুলুন নির্বাচন করুন, তারপরে যে ডিরেক্টরিতে কার্ডবোর্ড SDK এবং HelloCardboard ডেমো অ্যাপটি ক্লোন করা হয়েছিল সেটি নির্বাচন করুন৷

    আপনার কোড অ্যান্ড্রয়েড স্টুডিওতে প্রজেক্ট উইন্ডোতে প্রদর্শিত হবে।

  3. কার্ডবোর্ড SDK একত্রিত করতে, Gradle ট্যাবে কার্ডবোর্ড/:sdk/Tasks/build ফোল্ডারের মধ্যে অ্যাসেম্বল বিকল্পটিতে ডাবল-ক্লিক করুন (দেখুন > টুল উইন্ডোজ > গ্রেডল)।

  4. রান > রান... নির্বাচন করে আপনার ফোনে HelloCardboard ডেমো অ্যাপ চালান এবং hellocardboard-android টার্গেট নির্বাচন করুন।

QR কোড স্ক্যান করুন

ডিভাইস প্যারামিটার সংরক্ষণ করতে, কার্ডবোর্ড ভিউয়ারে QR কোড স্ক্যান করুন:

যদি ব্যবহারকারী "SKIP" চাপেন এবং পূর্বে সংরক্ষিত কোনো প্যারামিটার না থাকে, তাহলে কার্ডবোর্ড Google কার্ডবোর্ড v1 (Google I/O 2014-এ লঞ্চ হয়েছে) প্যারামিটার সংরক্ষণ করে।

ডেমো চেষ্টা করুন

HelloCardboard-এ, আপনি 3D স্পেসে জিওডেসিক গোলক খুঁজবেন এবং সংগ্রহ করবেন।

একটি গোলক খুঁজে পেতে এবং সংগ্রহ করতে:

  1. আপনি একটি ভাসমান আকৃতি দেখতে না হওয়া পর্যন্ত আপনার মাথা যে কোন দিকে ঘুরান।

  2. গোলকের দিকে সরাসরি তাকান। এটি রং পরিবর্তন করতে কারণ.

  3. গোলকটি "সংগ্রহ" করতে কার্ডবোর্ড ভিউয়ার বোতাম টিপুন৷

ডিভাইস কনফিগার করুন

যখন ব্যবহারকারী কার্ডবোর্ড ভিউয়ারগুলিকে স্যুইচ করতে গিয়ার আইকনে ট্যাপ করেন, তখন nativeSwitchViewer পদ্ধতি বলা হয়। nativeSwitchViewer কল করে CardboardQrCode_scanQrCodeAndSaveDeviceParams , যা দর্শকের QR কোড স্ক্যান করার জন্য উইন্ডোটি খোলে। কিউআর কোড স্ক্যান করার পর দর্শকের লেন্সের বিকৃতি এবং অন্যান্য পরামিতি আপডেট করা হয়।

// Called by JNI method
void HelloCardboardApp::SwitchViewer() {
  CardboardQrCode_scanQrCodeAndSaveDeviceParams();
}

অ্যান্ড্রয়েড স্টুডিও x86 এমুলেটর সক্ষম করুন

অ্যান্ড্রয়েড স্টুডিও x86 এমুলেটর তৈরি করতে, SDK এবং নমুনায় build.gradle ফাইলগুলি থেকে নিম্নলিখিত লাইনটি সরান:

abiFilters 'armeabi-v7a', 'arm64-v8a'

এটি সমস্ত ABI সক্ষম করে এবং জেনারেট করা .aar ফাইলের আকার উল্লেখযোগ্যভাবে বৃদ্ধি করবে। আরও তথ্যের জন্য Android ABIs দেখুন।

হেড ট্র্যাকিং

হেড ট্র্যাকার তৈরি করুন

হেড ট্র্যাকারটি HelloCardboardApp এর কনস্ট্রাক্টরে একবার তৈরি করা হয়:

HelloCardboardApp::HelloCardboardApp(JavaVM* vm, jobject obj, jobject asset_mgr_obj) {
  Cardboard_initializeAndroid(vm, obj); // Must be called in constructor
  head_tracker_ = CardboardHeadTracker_create();
}

যখন VrActivity তৈরি করা হয়, HelloCardboardApp ক্লাসের একটি উদাহরণ nativeOnCreate পদ্ধতিতে কল করে তৈরি করা হয়:

public void onCreate(Bundle savedInstance) {
  super.onCreate(savedInstance);
  nativeApp = nativeOnCreate(getAssets());
  //...
}

হেড ট্র্যাকার বিরতি এবং পুনরায় শুরু করুন

হেড ট্র্যাকারকে বিরতি, পুনরায় শুরু এবং ধ্বংস করতে, যথাক্রমে CardboardHeadTracker_pause(head_tracker_) , CardboardHeadTracker_resume(head_tracker_) , এবং CardboardHeadTracker_destroy(head_tracker_) কল করতে হবে। "HelloCardboard" অ্যাপে, আমরা তাদেরকে nativeOnPause , nativeOnResume এবং nativeOnDestroy এ কল করি:

// Code to pause head tracker in hello_cardboard_app.cc

void HelloCardboardApp::OnPause() { CardboardHeadTracker_pause(head_tracker_); }

// Call nativeOnPause in VrActivity
@Override
protected void onPause() {
  super.onPause();
  nativeOnPause(nativeApp);
  //...
}

// Code to resume head tracker in hello_cardboard_app.cc
void HelloCardboardApp::onResume() {
  CardboardHeadTracker_resume(head_tracker_);
  //...
}

// Call nativeOnResume in VrActivity
@Override
protected void onResume() {
  super.onResume();
  //...
  nativeOnResume(nativeApp);
}

// Code to destroy head tracker in hello_cardboard_app.cc
HelloCardboardApp::~HelloCardboardApp() {
  CardboardHeadTracker_destroy(head_tracker_);
  //...
}

// Call nativeOnDestroy in VrActivity
@Override
protected void onDestroy() {
  super.onDestroy();
  nativeOnDestroy(nativeApp);
  nativeApp = 0;
}

লেন্স বিকৃতি

প্রতিবার কার্ডবোর্ড একটি নতুন QR কোড স্ক্যান করে, নিম্নলিখিত কোডটি সংরক্ষিত প্যারামিটারগুলি পড়ে এবং লেন্স বিকৃতি বস্তু তৈরি করতে ব্যবহার করে, যা রেন্ডার করা সামগ্রীতে সঠিক লেন্স বিকৃতি প্রয়োগ করে:

CardboardQrCode_getSavedDeviceParams(&buffer, &size);

CardboardLensDistortion_destroy(lens_distortion_);
lens_distortion_ = CardboardLensDistortion_create(
    buffer, size, screen_width_, screen_height_);

CardboardQrCode_destroy(buffer);

রেন্ডারিং

কার্ডবোর্ডে বিষয়বস্তু রেন্ডার করার জন্য নিম্নলিখিতগুলি জড়িত:

  • টেক্সচার তৈরি করা
  • বাম এবং ডান চোখের জন্য ভিউ এবং প্রজেকশন ম্যাট্রিক্স পাওয়া
  • রেন্ডারার তৈরি করা এবং বিকৃতি মেশ সেট করা
  • প্রতিটি ফ্রেম রেন্ডারিং

টেক্সচার তৈরি করুন

সমস্ত বিষয়বস্তু একটি টেক্সচারের উপর আঁকা হয়, যা বাম এবং ডান চোখের জন্য বিভাগে বিভক্ত। এই বিভাগগুলি যথাক্রমে _leftEyeTexture এবং _rightEyeTexture এ আরম্ভ করা হয়েছে।

void HelloCardboardApp::GlSetup() {
  LOGD("GL SETUP");

  if (framebuffer_ != 0) {
    GlTeardown();
  }

  // Create render texture.
  glGenTextures(1, &texture_);
  glBindTexture(GL_TEXTURE_2D, texture_);
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
  glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);

  glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, screen_width_, screen_height_, 0,
               GL_RGB, GL_UNSIGNED_BYTE, 0);

  left_eye_texture_description_.texture = texture_;
  left_eye_texture_description_.left_u = 0;
  left_eye_texture_description_.right_u = 0.5;
  left_eye_texture_description_.top_v = 1;
  left_eye_texture_description_.bottom_v = 0;

  right_eye_texture_description_.texture = texture_;
  right_eye_texture_description_.left_u = 0.5;
  right_eye_texture_description_.right_u = 1;
  right_eye_texture_description_.top_v = 1;
  right_eye_texture_description_.bottom_v = 0;

  //...
  CHECKGLERROR("GlSetup");
}

এই টেক্সচারগুলি CardboardDistortionRenderer_renderEyeToDisplay এ প্যারামিটার হিসাবে পাস করা হয়।

বাম এবং ডান চোখের জন্য ভিউ এবং প্রজেকশন ম্যাট্রিক্স পান

প্রথমে, বাম এবং ডান চোখের জন্য চোখের ম্যাট্রিক্স পুনরুদ্ধার করুন:

CardboardLensDistortion_getEyeFromHeadMatrix(
    lens_distortion_, kLeft, eye_matrices_[0]);
CardboardLensDistortion_getEyeFromHeadMatrix(
    lens_distortion_, kRight, eye_matrices_[1]);
CardboardLensDistortion_getProjectionMatrix(
    lens_distortion_, kLeft, kZNear, kZFar, projection_matrices_[0]);
CardboardLensDistortion_getProjectionMatrix(
    lens_distortion_, kRight, kZNear, kZFar, projection_matrices_[1]);

এর পরে, প্রতিটি চোখের জন্য বিকৃতি মেশ পান এবং এটি বিকৃতি রেন্ডারারের কাছে প্রেরণ করুন:

CardboardLensDistortion_getDistortionMesh(lens_distortion_, kLeft, &left_mesh);
CardboardLensDistortion_getDistortionMesh(lens_distortion_, kRight, &right_mesh);

রেন্ডারার তৈরি করুন এবং সঠিক বিকৃতি জাল সেট করুন

রেন্ডারার শুধুমাত্র একবার আরম্ভ করা প্রয়োজন. রেন্ডারার তৈরি হয়ে গেলে, CardboardLensDistortion_getDistortionMesh ফাংশন থেকে ফিরে আসা জাল মান অনুযায়ী বাম এবং ডান চোখের জন্য নতুন বিকৃতি জাল সেট করুন।

distortion_renderer_ = CardboardOpenGlEs2DistortionRenderer_create();
CardboardDistortionRenderer_setMesh(distortion_renderer_, &left_mesh, kLeft);
CardboardDistortionRenderer_setMesh(distortion_renderer_, &right_mesh, kRight);

বিষয়বস্তু রেন্ডারিং

প্রতিটি ফ্রেমের জন্য, CardboardHeadTracker_getPose থেকে বর্তমান হেড ওরিয়েন্টেশন পুনরুদ্ধার করুন:

CardboardHeadTracker_getPose(head_tracker_, monotonic_time_nano, &out_position[0], &out_orientation[0]);

প্রতিটি চোখের জন্য একটি ভিউ প্রজেকশন ম্যাট্রিক্স রচনা করতে এবং স্ক্রিনে সামগ্রী রেন্ডার করতে ভিউ এবং প্রজেকশন ম্যাট্রিক্সের সাথে বর্তমান হেড ওরিয়েন্টেশন ব্যবহার করুন:

// Draw eyes views
for (int eye = 0; eye < 2; ++eye) {
  glViewport(eye == kLeft ? 0 : screen_width_ / 2, 0, screen_width_ / 2,
             screen_height_);

  Matrix4x4 eye_matrix = GetMatrixFromGlArray(eye_matrices_[eye]);
  Matrix4x4 eye_view = eye_matrix * head_view_;

  Matrix4x4 projection_matrix =
      GetMatrixFromGlArray(projection_matrices_[eye]);
  Matrix4x4 modelview_target = eye_view * model_target_;
  modelview_projection_target_ = projection_matrix * modelview_target;
  modelview_projection_room_ = projection_matrix * eye_view;

  // Draw room and target. Replace this to render your own content.
  DrawWorld();
}

সামগ্রীতে বিকৃতি সংশোধন প্রয়োগ করতে এবং স্ক্রীনে সামগ্রী রেন্ডার করতে CardboardDistortionRenderer_renderEyeToDisplay ব্যবহার করুন।

// Render
CardboardDistortionRenderer_renderEyeToDisplay(
    distortion_renderer_, /* target_display = */ 0, /* x = */ 0, /* y = */ 0,
    screen_width_, screen_height_, &left_eye_texture_description_,
    &right_eye_texture_description_);