Jetpack Compose-এর মাধ্যমে টাচস্ক্রিন ছাড়াও ইনপুট ইন্টার‍্যাকশন স্কেল করা

হ্যালো!

আশা করি Android ডেভেলপার সামিটে আপনার ভালো সময় কাটছে এবং আমাদের আলোচনা শোনার জন্য ধন্যবাদ।

আমি অ্যালেক্স ভ্যানিও, কম্পোজ টিমের একজন সফ্টওয়্যার ইঞ্জিনিয়ার এবং আমার সাথে যোগ দিয়েছেন জেরেমি, তিনিও কম্পোজ টিমের একজন সফ্টওয়্যার ইঞ্জিনিয়ার।

আমরা দুজনেই Jetpack Compose-এর ইনপুট সিস্টেম উন্নত করার জন্য কাজ করছি এবং আজ আমরা আলোচনা করব যে কীভাবে আমরা টাচস্ক্রিনের বাইরেও এটিকে স্কেল করেছি যাতে নন-টাচ ইনপুটকে সহজেই সাপোর্ট করা যায়।

ইনপুট, সাধারণভাবে, ব্যবহারকারী আপনার অ্যাপের সাথে ইন্টার‍্যাক্ট করার যেকোনও উপায় ক্যাপচার করে।

মোবাইল অ্যাপের কথা ভাবলে, টাচস্ক্রিনের কথা সম্ভবত প্রথমে মাথায় আসে, তবে এটিই একমাত্র ইনপুট নয়।

অন্যান্য ধরনের ইনপুটের মধ্যে রয়েছে ফিজিক্যাল কীবোর্ড, মাউস, ট্র্যাকপ্যাড, স্টাইলাস, কন্ট্রোলার ও রোটারি ডিভাইস।

এছাড়াও, আমরা নতুন ধরনের ইনপুট দেখতে পাচ্ছি, যেমন ইন্টেলিজেন্ট আইওয়্যারে ট্র্যাকপ্যাড, XR-এ আই ও হ্যান্ড ট্র্যাকিং এবং Wear-এ আঙুল ও কব্জির ইঙ্গিত।

আপনি যদি আরও সাধারণ কিছু চান, তাহলে অন্যান্য ধরনের ইনপুটও আছে: যেমন টেক্সট এডিটিংয়ের জন্য সফ্টওয়্যার IME, মাইক্রোফোন, ক্যামেরা এবং অন্যান্য ডিভাইস সেন্সর।

আপনার অ্যাপে বিভিন্ন ধরনের ইনপুট ব্যবহার করা হবে বলে ধরে নিতে হবে।

এর একটি কারণ হল, যে সমস্ত ডিভাইসে অ্যাপ্লিকেশন চলছে সেগুলির ক্রমবর্ধমান বৈচিত্র্য এবং সেই ডিভাইসগুলির ক্রমবর্ধমান অভিযোজনযোগ্যতা।

ডিভাইস ফর্ম ফ্যাক্টরে সবচেয়ে সাধারণ ইনপুট পদ্ধতি থাকতে পারে, তবে এটি মনে রাখা গুরুত্বপূর্ণ যে কোনও নির্দিষ্ট ডিভাইস ফর্ম ফ্যাক্টর মানেই কোনও নির্দিষ্ট ইনপুট ধরনের ব্যবহার নয়।

Chromebook-এ বিল্ট-ইন ট্র্যাকপ্যাড ও কীবোর্ড থাকলেও, সেই ইনপুট টাইপগুলি সেই ফর্ম ফ্যাক্টরের জন্য অনন্য নয়।

আপনি আশা করতে পারেন যে ফিজিক্যাল কীবোর্ড, ট্র্যাকপ্যাড এবং মাউস ফোন, ট্যাবলেট এবং টিভিতেও ব্যবহার করা হবে এবং কিছু টিভিতে টাচস্ক্রিনও রয়েছে।

একাধিক ইনপুট টাইপ আশা করা এবং সমর্থন করার দ্বিতীয় বড় কারণ হল অ্যাক্সেসিবিলিটি।

ব্যবহারকারীদের তাদের পছন্দের ইনপুট ডিভাইস ব্যবহার করার অনুমতি দেওয়া এবং তাদের উপযুক্ত মনে হলে ইনপুট ডিভাইস পরিবর্তন করার অনুমতি দেওয়া হল অ্যাপ্লিকেশনগুলিকে আরও অ্যাক্সেসযোগ্য এবং ব্যবহারযোগ্য করার সঠিক উপায়।

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

সংক্ষেপে, ফর্ম ফ্যাক্টর যাই হোক না কেন, আপনাকে বিভিন্ন ইনপুট টাইপের জন্য সহায়তা তৈরি করতে হবে।

তাই, Jetpack Compose কীভাবে আপনার অ্যাপকে ব্যবহারকারীর এইসব চাহিদা পূরণ করতে সাহায্য করে তা দেখা যাক।

Compose-এর দর্শন, সাধারণভাবে, হল যে এই বিভিন্ন ইনপুট প্রকারগুলি স্ট্যান্ডার্ড কম্পোনেন্ট সহ আউট অফ দ্য বক্স যথাযথভাবে আচরণ করা উচিত যাতে আপনাকে বিশেষ কিছু করতে না হয়।

এবং তারপরে, আপনার কাছে এমন টুল থাকা উচিত যা আপনার প্রয়োজন অনুযায়ী আচরণ কাস্টমাইজ এবং পরিবর্তন করতে পারে।

তাই, প্রাথমিক ইনপুটের ধরন ছাড়াও, আরও বেশি ইনপুটের ধরন আন্ডারলাইং প্ল্যাটফর্মে কাজ করলে, আমরা Compose কম্পোনেন্টে সেগুলির জন্য সাপোর্ট তৈরি করার লক্ষ্য রাখি, যাতে আপনার Compose-এর ভার্সন আপডেট করেই আপনার অ্যাপ্লিকেশনের আচরণ উন্নত করা যায়।

এই আলোচনায় আমরা এই ধরনের দুটি উদাহরণ দেখব, দুটিই Compose-এ সম্প্রতি যোগ করা হয়েছে।

কাকতালীয়ভাবে, দুটিই ট্র্যাকপ্যাডের মতো ডিভাইস, তবে আপনি দেখতে পাবেন যে সেগুলি খুব আলাদা উপায়ে ব্যবহার করা হয়।

তাহলে, ল্যাপটপ-স্টাইলের বিভিন্ন ট্র্যাকপ্যাডে সাম্প্রতিক কিছু কাজ দিয়ে শুরু করা যাক।

ট্র্যাকপ্যাড হল পয়েন্টার-ভিত্তিক ইনপুট ডিভাইস।

আরও নির্দিষ্টভাবে বলতে গেলে, আপনি ট্র্যাকপ্যাড ব্যবহার করলে, টু-ডাইমেনশনাল কোঅর্ডিনেট পাবেন।

কিন্তু টাচস্ক্রিনের মতো ট্র্যাকপ্যাডে আঙুলের সেই কোঅর্ডিনেট সরাসরি আপনার UI-এর কোঅর্ডিনেট স্পেসে থাকে না।

পরিবর্তে, ল্যাপটপের মতো ট্র্যাকপ্যাডের জন্য, কার্সর নিয়ন্ত্রণ করার জন্য একটি অনুবাদ রয়েছে।

এই অনুবাদের মধ্যে, আপনি অনেক জটিল প্ল্যাটফর্ম কনভার্সন আশা করতে পারেন: কার্সর অ্যাক্সিলারেশন এবং পাম রিজেকশনের মতো জিনিস।

তাই, Compose-এর দিকে আপনি যা পান তা হল কার্সরের লোকেশন অনুযায়ী একটি পয়েন্টার যা সাধারণত মাউস ইনপুটের মতো কাজ করে।

Android প্ল্যাটফর্ম থেকে, আমরা হোভার তথ্য, সেকেন্ডারি বা টারশিয়ারি ক্লিক সহ ক্লিক পাই এবং এই সমস্ত তথ্য MotionEvents-এ অন্তর্ভুক্ত করা হয়।

Compose-এর লেটেস্ট ভার্সনে আমরা কীভাবে আচরণ উন্নত করেছি তা বুঝতে, প্রথমে Compose কীভাবে এই পয়েন্টার ইভেন্টগুলিকে আরও ঘনিষ্ঠভাবে পরিচালনা করে তার একটি বিস্তৃত ওভারভিউ দেখে নেওয়া যাক।

আমি এটিকে ছয়টি আলাদা আলাদা পর্যায়ে ভাগ করতে চলেছি এবং আমরা এক এক করে এই সবকটি পর্যায় দেখব।

প্রথম ফেজ হল MotionEvents-এর কম্পোজে মুভ করা।

তাই, Compose আসলে, ব্যাকগ্রাউন্ডে, শুধু একটি ভিউ: একটি সত্যিই জটিল ভিউ যা অনেক কিছু করে, কিন্তু এটি শুধু একটি ভিউ, যার অর্থ হল এটিকে পয়েন্টার ইনপুটের জন্য সামগ্রিক Android সিস্টেমের মধ্যে কাজ করতে হবে।

তাই, Compose-এ, এর অর্থ হল Compose, যেহেতু এটি একটি সাধারণ অ্যাক্টিভিটির মধ্যে একটি সাধারণ উইন্ডোর মধ্যে থাকে, তাই এটি MotionEvents পায়: Android প্ল্যাটফর্মের MotionEvents।

তারপর Compose-কে সেগুলি ম্যানেজ করতে হবে এবং Compose-এর মধ্যে পয়েন্টার ইনপুট সংক্রান্ত আপনি যা যা করতে চান, তা করতে হবে।

এখানে প্রথম ধাপ হল সেই MotionEvents-কে Compose-এ একটি ইন্টার্নাল, প্ল্যাটফর্ম-অ্যাগনস্টিক রিপ্রেজেন্টেশনে অনুবাদ করা, যাকে আমরা PointerInputEvent বলি।

এটি ইন্টার্নাল টাইপ, তাই আপনি এটি সরাসরি দেখতে পাবেন না।

আর এখানে কী ঘটছে তার সব বিবরণ দেখতে চাইলে, আপনি MotionEventAdapter দেখতে পারেন, তবে আমরা এখানে সেইসব বিবরণ এড়িয়ে যাব।

তাই, এখন আমাদের কাছে Compose-এ MotionEvent-এর প্ল্যাটফর্ম-অ্যাগনস্টিক উপস্থাপনা আছে।

এরপর, দেখা যায় যে ইনপুট সাধারণত সময়ের সাথে সাথে হয়।

আপনি একের পর এক ইনপুট ইভেন্ট পান, তাই সময়ের সাথে সাথে কী ঘটছে তা জানা সত্যিই উপযোগী।

জেসচার, ভেলোসিটি ট্র্যাকিং, স্লোপ শনাক্তকরণের মতো বিষয়গুলি, প্রতিটি সময়ে কী ঘটছে তা বোঝার জন্য প্রয়োজন।

তাই, এই প্রসেসিং পাইপলাইনের পরবর্তী ধাপ হল এই সময়ের তথ্য যোগ করা এবং এটি পরপর পয়েন্টার ইভেন্টের উপর ভিত্তি করে কিছু প্রিপ্রসেসিং করতে চলেছে।

কোডে, আপনি এটিকে বর্তমান PointerInputEvent হিসেবে দেখতে পারেন, যা আগেরটির সাথে কী ঘটেছে তার সাথে একত্রিত করে এবং তারপরে আমরা একটি সময়-সচেতন InternalPointerEvent তৈরি করি।

এটি আরেকটি ইন্টার্নাল টাইপ, নাম থেকে যেমন বোঝা যাচ্ছে, তবে আপনি এটিকে বিভিন্ন পয়েন্টার আইডি থেকে পয়েন্টার ইনপুট পরিবর্তনের ম্যাপ হিসেবে ভাবতে পারেন এবং PointerInputChanges হল একটি পাবলিক টাইপ।

এটিই আমাদের প্রথম।

এবং বিভিন্ন পয়েন্টার আইডি সম্পর্কে চিন্তা করার সময় আপনি লক্ষ্য করতে পারেন যে এখন আমরা সময় ট্র্যাক করার বিষয়ে সচেতন, আমরা পয়েন্টার আইডি কখন আসে এবং যায় তাও ট্র্যাক করতে পারি।

শুধু একটি নয়।

টাচ স্ক্রিনে একাধিক আঙুল থাকলে, একই সময়ে একাধিক পয়েন্টার আসতে ও যেতে পারে এবং আমাদের সেটি ম্যানেজ করতে হবে।

আবার, আপনি যদি বিস্তারিত জানতে চান, তাহলে PointerInputChangeEventProducer দেখতে পারেন, যা এই সব করে, কিন্তু আমরা তা এড়িয়ে যাব।

আমাদের আরও অনেক কিছু করতে হবে।

সুতরাং, এখন আমাদের কাছে ইনপুটের কম্পোজিশন উপস্থাপনা আছে এবং এতে সময়ের তথ্য আছে।

পরবর্তী ধাপ হল, সেই ইভেন্ট নিয়ে কী করতে হবে তা খুঁজে বের করা।

আমরা এটি কোথায় পাঠাব?

আর এর ফলে হিট পাথ টেস্টিং হয়।

তাহলে, এমন একটি পরিস্থিতি কল্পনা করা যাক যেখানে আমাদের কাছে একটি MotionEvent পাঠানো হচ্ছে এবং এই ComposeView পুরো উইন্ডো, সম্ভবত পুরো স্ক্রিনটি পূরণ করছে।

এটি কোথায় পাঠাতে হবে তা আমাদের জানতে হবে।

এবং যেহেতু Compose হল শুধুমাত্র একটি ভিউ, কিন্তু Compose-এর মধ্যে আমাদের কাছে প্রচুর জিনিস রয়েছে, একগুচ্ছ বিভিন্ন নোড, বোতাম, এমন জিনিস যার সাথে আপনি ইন্টার‍্যাক্ট করেন, তাই আমাদের Compose-এ নির্দিষ্ট অবস্থানে ঘটে যাওয়া ইভেন্ট কোথায় পাঠাতে হবে তা খুঁজে বের করার সমস্ত কাজ করতে হবে এবং কোন নোড আসলে এতে আগ্রহী তা খুঁজে বের করতে হবে।

এইসব লেআউট নোডের কোঅর্ডিনেট, বাউন্ড ও আকার আছে, তাই আমাদের খুঁজে বের করতে হবে যে কোনও একটিতে হিট করা হয়েছে কিনা।

তবে এটিও সবচেয়ে সাধারণ ভিউ নয়।

দেখা যাচ্ছে যে আমরা ইন্টার‍্যাক্ট করা যায় এমন জিনিস অন্য ইন্টার‍্যাক্ট করা যায় এমন জিনিসের মধ্যে রাখতে পছন্দ করি, যেমন তালিকার মধ্যে বোতাম রাখা।

দেখা যাচ্ছে যে আমরা এটি অনেকবার করি।

সুতরাং, এখানে সম্পূর্ণ সাধারণ কেস হল যে একটি নির্দিষ্ট ইনপুট ইভেন্ট একটি সম্পূর্ণ হিট পাথ তৈরি করে যা ইনপুট ইভেন্টের স্থানাঙ্ক দ্বারা হিট করা প্রতিটি ইন্টার‍্যাক্ট করা যায় এমন নোডের মধ্য দিয়ে যায়।

তাই, এই ক্ষেত্রে, নেস্টিং হায়ারার্কির মাধ্যমে তিনটি আইটেম আছে।

তাই, আমাদের কাছে হিট পাথ আছে, কিন্তু সেটিও যথেষ্ট নয়।

মনে আছে, আমি বলেছিলাম যে আমাদের একাধিক পয়েন্টার ইনপুট ইভেন্ট আছে, একাধিক পয়েন্টার যা ডাউন থাকতে পারে?

আসলে আমাদের সম্পূর্ণ হিট পাথ ট্রি প্রয়োজন।

একাধিক পয়েন্টার থাকলে, শুধু একটি হিট পাথ থাকে না।

সুতরাং, এটি পরবর্তী ধাপ, এই হিট পাথ ট্রি তৈরি এবং আপডেট করা।

সুতরাং, কী ঘটছে তার আরও বিস্তারিত বিবরণ এখানে দেওয়া হল।

বাঁদিকে, আমাদের কাছে এমন নোড আছে যা ভিজ্যুয়ালি সাজানো আছে এবং তারপরে নিচের বাঁদিকে, আপনি হায়ারার্কিক্যাল উপস্থাপনা দেখতে পাবেন, কোন নোডগুলি অন্যান্য নোডের ভিতরে আছে, কোনগুলি একে অপরের পূর্বপুরুষ বা বংশধর।

পয়েন্টার নিচে নেমে গেলে, আমরা সেই হিট পাথ, ট্রি-এর সম্পূর্ণ পাথ ট্র্যাক করি এবং তারপর সেই নির্দিষ্ট পয়েন্টারের জন্য হিট পাথ পাই।

দ্বিতীয় পয়েন্টার পাওয়ার পরে এই হিট পাথ একটি ট্রি হয়ে যায়।

এটি অন্যটির মতো একই নোডের সাথে ইন্টারসেক্ট করতে পারে, তবে এটি অন্য নোডের সাথেও ইন্টার‍্যাক্ট করতে পারে।

তাই, ডানদিকে, এটি হল হিট পাথ ট্রি যা আমরা এখন বজায় রাখছি।

এবং পয়েন্টার আসতে এবং যেতে পারে, তাই আমাদের নিজেদেরই সময়ের সাথে সাথে এটি বজায় রাখতে হবে যাতে আমরা এই মুহূর্তে প্রতিটি চলমান ইভেন্টে আগ্রহী নোডের সম্পূর্ণ তালিকা পাই।

ঠিক আছে।

তাই, এখন আমাদের কাছে একটি হিট পাথ ট্রি আছে যা আমরা এই ইনপুট ইভেন্টগুলির জন্য বজায় রাখছি, যার অর্থ হল আমরা পরবর্তী পর্যায়ে আছি।

এখন, আমরা আসলে জানি যে আমরা এই পয়েন্টার ইনপুট ইভেন্টগুলি কোথায় পাঠাতে যাচ্ছি, কোন নোডগুলি প্রতিটি নির্দিষ্ট ইভেন্টে আগ্রহী।

এখন আমরা এটি জানি, তাই আমরা একটি কোঅর্ডিনেট ট্রান্সফর্মেশন করতে পারি।

আপনার নোড যদি নিজস্ব লোকাল কোঅর্ডিনেট স্পেসের মধ্যে ইনপুট ইভেন্ট পায়, তাহলে সেটি সত্যিই খুব ভালো হয়, কারণ আপনাকে তখন, আপনি জানেন, কোঅর্ডিনেট ম্যাথ নিজেকেই করতে হয় না।

তাই, একবার আমরা তা জানতে পারলে, আমরা পয়েন্টার ইনপুট ইভেন্ট নিতে পারি, এটিকে আগ্রহী নোডের কোঅর্ডিনেটের সাথে একত্রিত করতে পারি এবং তারপরে এটি অবশেষে সেই পাবলিক PointerEvent তৈরি করছে যা আপনাদের সকলের কাছে এবং পয়েন্টার ইনপুট মডিফায়ারের কাছে পাঠানো হবে।

আর এটাই আমাদের ফেজের শেষ ধাপ, ফেজ ৬, অবশেষে ইভেন্টটি পাঠানো।

এটি একটি পয়েন্টার ইনপুট ইভেন্ট যা ঘটেছে এবং নোডে পাঠানো হচ্ছে যাতে এটি যা খুশি তাই করতে পারে।

আমরা তিনটি আলাদা পাসের মাধ্যমে এটি করি।

আমাদের কাছে একটি প্রাথমিক পাস, একটি প্রধান পাস এবং একটি চূড়ান্ত পাস আছে।

তিনটি আলাদা পাস থাকার কারণ হল, এটি নোডগুলিকে একে অপরের সাথে যোগাযোগ করতে এবং নির্দিষ্ট পয়েন্টার ইনপুট ইভেন্টের নির্দিষ্ট অংশে আগ্রহ প্রকাশ করতে দেয় এবং তারপরে ডিসপ্যাচের অংশ হিসাবে তাদের বিভিন্ন অংশ ব্যবহার করে।

সুতরাং, প্রথম পাস, প্রাথমিক পাস, পূর্বপুরুষ থেকে বংশধরের কাছে যায়।

এটি কোথায় কাজে লাগে তার একটি উদাহরণ হল, কোনও বাইরের লেআউট নোড যদি স্ক্রলিং কন্টেনার হয় এবং এটি জানে যে এটি স্ক্রল করা শুরু করেছে এবং এটি চায় না যে কোনও পয়েন্টার ইভেন্ট এর কোনও চাইল্ড নোডে পৌঁছাক।

এটি, প্রাথমিক পাসে, এটি ব্যবহার করার অনুমতি দেয় এবং তারপরে বাচ্চারা আর কোনও ইভেন্ট পাবে না।

দ্বিতীয় পাসটি হল প্রধান পাস।

এবং এটিই একমাত্র যা বংশধর থেকে পূর্বপুরুষে যায়।

নাম থেকে যেমন বোঝা যাচ্ছে, এটি হল কাজ করার জন্য প্রাথমিক পাস।

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

এবং তারপরে শেষ পাস, ফাইনাল পাস, প্রাথমিক পাসের মতোই দেখায়, যেখানে এটি পূর্বপুরুষ থেকে বংশধরের কাছে যায়।

এবং এখানে একটি চাইল্ড, পেরেন্টকে বলতে পারে যে পেরেন্ট কোনও ইভেন্টের অংশ ব্যবহার করেছে।

তাই, এবং হয়ত যদি কোনও চাইল্ড ক্লিক হ্যান্ডেল করা শুরু করে, কিন্তু তারপরে কোনও পেরেন্ট স্ক্রল করা শুরু করে, তাহলে চাইল্ড দেখতে পাবে যে পেরেন্ট সেটি করেছে এবং তারপরে চাইল্ড যে ক্লিক হ্যান্ডেল করা শুরু করেছিল সেটি বাতিল করতে পারবে।

তাহলে, এই হল তিনটি পাস এবং এই হল ছয়টি ফেজ।

পয়েন্টার ইনপুট সিস্টেমের উপরে থাকা সবকিছুর ভিত্তি হল এটি।

আপনার সব জেসচার হ্যান্ডলিং, স্ক্রল করা, টেনে আনা, ক্লিক করা এবং যেকোনও কাস্টম পয়েন্টার ইনপুট এই ফাউন্ডেশনের উপরে তৈরি করা হয়েছে।

সুতরাং, এই সবের সাথে, আমরা এখন Compose-এ ট্র্যাকপ্যাড বিহেভিয়ার সাপোর্ট কীভাবে উন্নত করেছি তার নির্দিষ্ট কিছু বিষয় নিয়ে কথা বলতে পারি।

তাই, Compose 1.12-এর আগে, ট্র্যাকপ্যাড ইনপুট ইভেন্টগুলি টাচের পয়েন্টার টাইপ হিসাবে রিপোর্ট করা হত, কারণ এটি কার্সর নিয়ন্ত্রণ করার জন্য ট্র্যাকপ্যাডের সাথে শারীরিকভাবে ইন্টার‍্যাক্ট করা একটি আঙুল।

তবে, ব্যবহারকারী আশা করেন যে এই ইনপুট টাইপটি ফিজিক্যাল মাউসের মতোই কাজ করবে।

তাই, আমরা পয়েন্টারের ধরন PointerType.Touch থেকে PointerType.Mouse-এ পরিবর্তন করেছি।

এই পরিবর্তনের ফলে, ব্যবহারকারীরা এই তথ্য দেখছে এমন যেকোনও কম্পোনেন্টের জন্য অনেক বেশি সামঞ্জস্যপূর্ণভাবে অ্যালাইন করা মাউস ও ট্র্যাকপ্যাড অভিজ্ঞতা দেখতে পাবেন।

এখানে একটি উদাহরণ হল টুলটিপ আচরণ: আপনি সম্ভবত টুলটিপের জন্য ট্র্যাকপ্যাড এবং মাউসের জন্য একই আচরণ করতে চান।

ট্র্যাকপ্যাডের ক্ষেত্রে আমরা দ্বিতীয় যে বড় পরিবর্তন করেছি তা হল ট্র্যাকপ্যাডে মাল্টি-ফিঙ্গার জেসচার।

আগে, Compose, Android প্ল্যাটফর্মের নকল আঙুলের চতুর, কিন্তু কিছুটা ভুতুড়ে ধারণার মাধ্যমে পাস করত।

তাহলে, এর অর্থ কী তা দেখা যাক।

প্যান করার জন্য ট্র্যাকপ্যাডে দুটি আঙুল ব্যবহার করলে, Android একটি নকল টাচস্ক্রিন আঙুল তৈরি করে যা কার্সর যেখানে আছে সেখানে নেমে যায়।

তারপর, আপনি ট্র্যাকপ্যাডে আঙুল সরালে, টাচস্ক্রিনে থাকা নকল আঙুলটি সঠিক দূরত্ব এবং দিকনির্দেশ অনুযায়ী সরে যায় যাতে কাঙ্ক্ষিত আচরণটি নকল করা যায় এবং তারপরে এটি ছেড়ে দেয়।

তাই, ট্র্যাকপ্যাডে দুটি আঙুল উপরের দিকে সরানোর ফলে টাচস্ক্রিনে একটি নকল আঙুল উপরের দিকে সরানোর মতো কাজ হয়, যার ফলে স্ক্রল ডাউন হয়।

এখানে একটি মজার বিষয় হল, আপনি যদি আমার মতো রিভার্স ট্র্যাকপ্যাড স্ক্রলিং ফিচার ব্যবহার করেন, তাহলে আপনি স্ক্রলিং আসলে অন্য দিকে করতে চাইবেন।

আর এটি করার উপায় হল, নকল আঙুলটি যেদিকে যাচ্ছে তার উল্টো দিকে যাওয়া।

তাই এখন, ট্র্যাকপ্যাডে দুটি আঙুল উপরের দিকে সরালে তা টাচস্ক্রিনে একটি নকল আঙুল নিচের দিকে সরানোর মতো কাজ করে, যার ফলে স্ক্রল আপ হয়, যা আমরা আগে যা পেতাম তার বিপরীত।

স্কেলিংও প্রায় একই রকমভাবে কাজ করে।

আপনি ট্র্যাকপ্যাডে দুটি আঙুল ব্যবহার করে স্কেল করলে, Android দুটি নকল টাচস্ক্রিন আঙুল তৈরি করে যা নিচে নেমে আসে এবং তারপরে জুম ইন বা জুম আউট করার কাঙ্ক্ষিত আচরণ অনুকরণ করার জন্য জেসচারের উপর নির্ভর করে কাছাকাছি বা আরও দূরে সরে যায়।

তাই, প্যানিংয়ের জন্য Compose 1.12 এবং স্কেলিংয়ের জন্য Compose 1.13 থেকে, আমরা এখন সেইসব ফেক ফিঙ্গার ইন্টারসেপ্ট করি।

প্ল্যাটফর্ম যেভাবে আমাদের কাছে পাঠায়, আমরা সেভাবে পাঠাই না এবং আমরা সেগুলিকে নতুন পয়েন্টার ইভেন্ট টাইপে ব্যাখ্যা করি: প্যানিংয়ের জন্য PanStart, PanMove ও PanEnd এবং স্কেলিংয়ের জন্য ScaleStart, ScaleChange ও ScaleEnd।

এবং আমরা এটি সেই Android-টু-Compose ইভেন্ট কনভার্সন ফেজে করি যার ব্যাপারে আমি আগে বলেছি।

তাই, আমরা ফেক ফিঙ্গার ইভেন্টকে তার উপযুক্ত ইভেন্টে কনভার্ট করি এবং তারপর এই প্ল্যাটফর্ম-নির্ধারিত জেসচারের মাধ্যমে কার্সরের সাথে সম্পর্কিত হিট পাথে পাঠাই।

এবং দেখা যাক কেন এটি গুরুত্বপূর্ণ।

আমরা কেন এটি করি?

তাহলে, ধরা যাক এখানে এই বক্সটি একটি সুন্দর ছবি যা আমরা স্কেল আপ করতে চাই।

আপনি যখন স্কেল করার জন্য ট্র্যাকপ্যাডে দুটি আঙুল ব্যবহার করছেন, তখন দুটি নকল আঙুলের মধ্যে একটি এলিমেন্ট মিস করতে পারে।

এটির হিট পাথ ছবির সাথে ইন্টারসেক্ট করবে না এবং এটি বাউন্ডের বাইরে শুরু হবে।

তাই, স্কেলিংয়ের পরিবর্তে যা হবে তা হল, ছবিটি স্ক্রল করবে।

তারপর, ছবির বাইরে স্ক্রল করা যায় এমন অন্য কোনও এলিমেন্ট থাকলে, সেটিও হয়ত একসাথে স্ক্রল করা শুরু করবে।

ব্যবহারকারী এটি চাননি।

তারা স্কেল করতে চেয়েছিল।

তাই, এখন আমরা যা করি তা হল সেই নকল আঙুলের মাধ্যমে পাঠানোর পরিবর্তে, আমরা এখন কার্সারের অবস্থানের ঠিক নিচে থাকা এলিমেন্টে স্কেলিং জেসচার পাঠাই, যা সঠিক আচরণে নিয়ে যায়।

কার্সর যেখানেই থাকুক বা আপনি যে এলিমেন্ট স্কেল করতে চান তার প্রান্তের কতটা কাছাকাছি থাকুক না কেন, এটি এখন সঠিকভাবে স্কেল করবে।

তাই, আপনাদের সকলের জন্য সুখবর হল যে, এই নতুনভাবে ব্যাখ্যা করা ইনপুট ইভেন্টগুলি ডিফল্টভাবে স্ক্রোলযোগ্য এবং ট্রান্সফর্মযোগ্য কম্পোনেন্টে ব্যবহার করা হয় যাতে আপনি যদি সেইসব বেসিক বিল্ডিং ব্লক ব্যবহার করেন তাহলে ট্র্যাকপ্যাড ইনপুটের জন্য আরও ভাল ফিডেলিটি আচরণ প্রদান করা যায়।

এবং আপনি যদি এগুলির উপরে তৈরি কিছু ব্যবহার করেন, তাহলে আপনি Compose-এর ভার্সন লেটেস্ট ভার্সনে আপডেট করে সেই উন্নত আচরণ পাবেন।

আপনি যদি কাস্টম পয়েন্টার ইনপুট মডিফায়ার লেখেন, তাহলে আমি আপনাকে এই নতুন APIগুলি দেখে নিতে এবং এই সমস্ত বিভিন্ন ইনপুট ডিভাইস জুড়ে আপনার ব্যবহারকারীদের সম্ভাব্য সেরা অভিজ্ঞতা দিতে আপনি তাদের সমর্থন করছেন কিনা তা নিশ্চিত করতে উৎসাহিত করব।

এবং, অবশ্যই, আমরা টেস্টিং API-ও যোগ করেছি, যাতে আপনি চেক করতে পারেন যে আপনার অ্যাপ এইসব বিভিন্ন ইনপুট টাইপ সঠিকভাবে ম্যানেজ করছে কিনা।

তাই, performTrackpadInput-কে মাউস ও টাচের জন্য আগে থেকে থাকা টেস্টিং API-এর মতোই দেখতে লাগে।

onNodeWithContentDescription("Photo")
    .performTrackpadInput {
        click(center)

        pan(Offset(0f, 100f))

        scale(0.9f)
    }

এবং, এই সবকটি ব্যবহার করে, আপনি যাচাই করতে পারবেন যে আপনার অ্যাপ সঠিকভাবে কাজ করছে, ব্যবহারকারী আপনার ডিভাইসে যে ইনপুট ডিভাইস ব্যবহার করছেন তা নির্বিশেষে।

সুতরাং, আশা করি এটি আপনাকে অনেক ভাল ধারণা দেবে যে কীভাবে একটি পয়েন্টার ইভেন্ট টাচপ্যাডে আঙুল থেকে আপনার অ্যাপে যায়।

আর, আমি এখন জেরেমিকে ট্র্যাকপ্যাড ব্যবহারের সম্পূর্ণ ভিন্ন একটি উপায় সম্পর্কে কথা বলতে দেব।

ধন্যবাদ।

ঠিক আছে।

হ্যালো, আমি জেরেমি ওয়াকার।

আমি ইনপুট নিয়ে অনেক কাজ করি এবং আমি ভেবেছিলাম যে Compose ইনপুট নিয়ে আমরা যে নতুন কাজ করছি এবং তা কীভাবে আপনাকে প্রভাবিত করে সেই সম্পর্কে কিছু বললে তা আপনার কাছে আকর্ষণীয় হবে।

বিশেষ করে এই পরোক্ষ ইনপুট টাইপের ক্ষেত্রে, যা নতুন ফর্ম ফ্যাক্টরের উপর ভিত্তি করে নতুন ইনপুটের কারণে এসেছে: ইন্টেলিজেন্ট আইওয়্যার।

তাই, চশমা থেকে ইনপুট পাওয়ার সময়, আপনি কয়েকটি উপায়ে তা করতে পারেন: আপনি কোনও কিছুর দিকে তাকিয়ে থাকতে পারেন, আপনার ভয়েস ব্যবহার করতে পারেন, আপনি জেসচার ব্যবহার করতে পারেন, তবে আমি বিশেষভাবে টাচপ্যাড সম্পর্কে কথা বলতে যাচ্ছি।

আর এগুলি অ্যালেক্স যেগুলির কথা বলেছে তার থেকে একটু আলাদা, এগুলি আপনার মাথার পাশে থাকে, উল্লম্ব, খুব চওড়া এবং অত্যন্ত ছোট।

তাই, Compose-এ এটি কীভাবে কাজ করবে তা নিয়ে আমরা যখন ভাবছিলাম, তখন আপনি যদি কল্পনা করেন যে আপনার সামনে একটি ছোট বোতাম রয়েছে এবং আপনি কার্সরটি সেটির দিকে নিয়ে গিয়ে টাচ করার চেষ্টা করছেন, তাহলে সেটি খুব একটা ভালো অভিজ্ঞতা হবে না, তাই না?

তাহলে, আমরা কীভাবে এটিতে সহায়তা করব?

Well, this is what As a reminder, this is what Glasses UI looks like.

আপনার ফিল্ড অফ ভিউতে কন্টেন্ট নির্বিঘ্নে দেখানোর জন্য এটি অনন্যভাবে ডিজাইন করা হয়েছে।

তবে এটি খুব সহজ, যেমন, আমরা এটি সহজ রাখার চেষ্টা করি।

আমরা যদি এখানে একটি উদাহরণ দেখি, তাহলে আপনি দেখতে পাবেন যে এটি একটি তালিকা।

এটি কেন্দ্রে একটি নির্দিষ্ট উপাদানের উপর ফোকাস করে।

আমরা আসলে কী করতে চাই?

আমরা এটি বেছে নিতে চাই অথবা আগের বা পরের আইটেমে যেতে চাই।

আমাদের স্ক্রিন লোকেশন প্রয়োজন নেই।

আর এটি একটু বেশি জটিল, তবে আপনি দেখতে পাচ্ছেন যে মূলত তিনটি বিকল্প আছে: আপনি কল কেটে দিতে পারেন, আনমিউট করতে পারেন অথবা ভিডিও বন্ধ করতে পারেন।

কিন্তু, আপনি কি সত্যিই এটি বেছে নিতে চান নাকি অন্য কোনও একটিতে গিয়ে সেটি বেছে নিতে চান।

তাই, আমরা ভাবছি যে স্ক্রিনে কোনও লোকেশনে বা এই ক্ষেত্রে আপনার চোখে সরাসরি ম্যাপ করার প্রয়োজন নেই।

হ্যাঁ, এটি আসলে দেখতে এরকম।

তাই, আপনাকে একটি উদাহরণ দিতে, আপনি এখানে দেখতে পাচ্ছেন, আমি শুধু এলিমেন্টের মধ্যে ঘোরাফেরা করছি এবং এটি Glasses UI-তে রয়েছে এবং এটি আমাদের যা চাই তার সাথে মানানসই।

এবং, আপনি এটিতে ট্যাপ করতে পারেন।

এখন, তাই, আমরা Android-এর দিকে তাকিয়ে ভাবলাম, সেখানে কী কী আছে যা আমরা এটিকে সমর্থন করার জন্য ব্যবহার করতে পারি।

আর তোমরা যদি কখনও ওহ, দুঃখিত।

এটি এখানে স্কিপ করে এগিয়ে যাচ্ছে।

আমাকে ফিরে যেতে দিন।

এই তো হয়ে গেছে।

ঠিক আছে।

তাই, আপনারা যদি কখনও এইসব ডিভাইসের মধ্যে কোনও একটি ব্যবহার করে থাকেন এবং সেটি Android ডিভাইসের সাথে লিঙ্ক করে থাকেন, তাহলে আপনারা জানেন যে, একটি থেকে অন্যটিতে UI এলিমেন্ট সহজেই সরানো যায়।

যেমন, রিমোটের সাহায্যে আপনি দেখতে পাবেন যে আপনি যদি কল্পনা করেন বা Google TV-এর সাথে লিঙ্ক করেন এবং আপনার কাছে সিনেমার একটি সম্পূর্ণ গ্রিড থাকে, তাহলে আপনি যে সিনেমাটি চান সেখানে যেতে তীরচিহ্ন বোতাম প্রেস করতে পারেন এবং এটি বেছে নিতে ওকে বোতাম প্রেস করতে পারেন।

আপনার কাছে গেম মেনু এবং এই কন্ট্রোলার থাকলে, আপনি ডি-প্যাড বা জয়স্টিক ব্যবহার করে UI এলিমেন্টে যেতে পারবেন, যেমন, মেনুতে গিয়ে সেটি বেছে নিতে পারবেন।

কীবোর্ডের ক্ষেত্রেও একই।

তাই, Compose-এ আমরা যা চাই, তার সাথে এটি মিলে যায়।

এবং আবার, এখানে জিনিসগুলি রয়েছে, যাতে আপনি এটি কেমন দেখায় তার একটি ধারণা পেতে পারেন।

আর আমরা যদি আরও একটু পিছনে যাই, তাহলে আসলে এই টাচপ্যাড টাইপ ছিল যা টিভির সাথে পেয়ার করা ছিল এবং এটি আসলে নেভিগেশন টাচ নামে কিছু ব্যবহার করে।

এবং সেখানে ধারণাটি হল এটি সম্পূর্ণভাবে x এবং y স্থানাঙ্ক নয় যা সম্পূর্ণভাবে স্পর্শ করা হয়নি স্ক্রিনের সাথে একেবারেই বাঁধা নেই।

এগুলি শুধুমাত্র জেসচার শনাক্তকরণের জন্য ব্যবহার করা হয়।

সুতরাং, আপনি সেখানে যা করেন তা হল আপনি যদি ডানদিকে সোয়াইপ করেন, আপনি কল্পনা করতে পারেন যে এটি লাইক প্রেস করার মতো, তীরটি উপরে যাওয়ার জন্য।

আপনি বাঁদিকে সোয়াইপ করলে, বাঁদিকে, উপরে ও নিচে যেতে পারবেন।

তাই, এটি আমাদের যা চাই তার বেশিরভাগই দেয়।

আপনি শুধু x ও y ব্যবহার করেন, যেমন ভেলোসিটি ট্র্যাকিংয়ের জন্য, যাতে ড্র্যাগ ও সোয়াইপ ইত্যাদি বোঝা যায়। তাই, Compose-এ কাজ শুরু করার জন্য যা যা প্রয়োজন, তার বেশিরভাগই আমরা পেয়ে যাই।

এটি সঠিক নয় কারণ এটি টিভির সাথে ম্যাপ করা হয়েছে, তাই আমাদের নিশ্চিত করতে হবে যে আমরা টিভির রুট অনুসরণ করছি না, পরে টিভির সাথে কোনও সমস্যা করছি না, তাই আমাদের নিশ্চিত করতে হবে যে আমরা সেগুলি আলাদা করছি, তবে এটি এমন কিছু যা আমরা একটু পরে করব।

তবে এটি আমাদের এক ধরনের শুরুর পয়েন্ট দেয়।

যাতে আমরা এই ধরনের টাচ নেভিগেশন ব্যবহার করতে পারি।

তাহলে, ঠিক আছে।

API ডিজাইন কেমন হতে চলেছে?

Compose-এ সবচেয়ে সাধারণ ইনপুট হল টাচ, তাই তো?

তাই, এই বিষয়ে আমাদের অনেক কাজ করতে হয়।

তাই, আমাদের বুঝতে হয়েছে যে এটি কীভাবে তার সাথে সম্পর্কিত।

তাই রিমাইন্ডার হিসেবে, PointerEvent দেখতে কেমন হয় তা এখানে দেখানো হল।

আপনি এখানে দেখতে পাচ্ছেন যে আপনার কাছে এমন একটি টাইপ আছে যা উপরের দিকে নিচের দিকে সরানোর মতো, এবং তারপরে আপনার কাছে এই PointerInputChange আছে যা শুধুমাত্র একটি তালিকা আপনি এটিকে আঙ্গুল হিসাবে ভাবতে পারেন।

আপনি তিনটি আঙুল নামিয়ে রাখলে, তালিকায় তিনটি জিনিস থাকবে।

তাই আমরা এটিকে অনেকটা এইরকম দেখাতে চেয়েছিলাম।

এখন, এটি কোনও UI মডিউল নয় যা বেশিরভাগ ডেভেলপার ইনপুট নিয়ে কাজ করার সময় ব্যবহার করেন তার চেয়ে অনেক কম মডিউল।

সেগুলি ফাউন্ডেশন লেয়ারের উপরে একটি লেয়ার হতে চলেছে।

আর সেখানেই আমাদের সব জেসচার ডিটেক্টর আছে।

কারণ ডেভেলপার হিসেবে, আপনি এই ধরনের মিনিট ইনপুটের মতো বিষয় নিয়ে মাথা ঘামান না।

আপনি শুধু জানতে চান, ড্র্যাগ, ক্লিক বা সোয়াইপ করা হয়েছে কিনা এবং তারপর আপনি তার ভিত্তিতে অ্যাকশন নেন।

তাই, আমাদের কাছে একগুচ্ছ কোড আছে যা আপনার জন্য এটি করে এবং এটি ব্যাকগ্রাউন্ডে এগুলির দ্বারা পরিচালিত হয়।

তাই, আমরা ভাবতে শুরু করি, ঠিক আছে, আমাদের ফাউন্ডেশনে থাকা কোডের জন্য যতটা সম্ভব সহজ করতে হবে যাতে এই নতুন ধরনের কোড সহজেই সাপোর্ট করা যায়।

তাই, আমরা নতুন ধরনের ফন্ট তৈরি করেছি যা দেখতে প্রায় একই রকম।

এটি ইনডাইরেক্ট ট্রানজ্যাকশন হিসেবে পরিচিত।

এবং পরোক্ষভাবে এর অর্থ হল স্ক্রিনে সরাসরি টাচ করা নয়।

তাই, এটি আপনাকে জানায় যে, আরে, এটি আসছে। টাচ পয়েন্টের দিক থেকে এটি নিয়ে ভাববেন না।

মনে রাখবেন, আমরা এখানে শুধু জেসচার ম্যানেজ করছি এবং UI এলিমেন্টের মধ্যে নেভিগেট করছি।

ধরন একই।

এতে আঙুলের তালিকা আছে।

এই ক্ষেত্রে এটি IndirectPointerInputChange।

কিন্তু আমরা সেগুলি করেছি এবং তা খুব ভালভাবে কাজ করেছে।

কিন্তু তারপরে আমরা আরও একটি আইটেম দেখতে পাই, যার নাম প্রাইমারি ডিরেকশনাল মোশন অ্যাক্সিস।

এটি বেশ জটিল, তবে আমি যখন এটি ব্যাখ্যা করব তখন এটি বোঝা সহজ হবে, কারণ এটি কীভাবে তৈরি হয়েছিল তা বেশ আকর্ষণীয়।

তাহলে, এটি কীভাবে হল?

আবার, আপনার মাথার পাশে এই টাচপ্যাড আছে এবং এটি চওড়া ও ছোট।

আর তাই, এই মুহূর্তে, আমাদের কাছে এই ধরনের আইডিয়া আছে, যেমন, ঠিক আছে, আমাদের কাছে টাচ নেভিগেশন আছে।

তাই, আমরা বাঁদিকে ও ডানদিকে সোয়াইপ করতে পারি।

এবং এটি ভাল কাজ করে।

কিন্তু আপনি যদি ভাবেন যে ট্র্যাকপ্যাড এখন কীভাবে আছে, তাই না?

আপনি বাঁদিকে বা ডানদিকে গেলে, আপনার UI কন্টেন্ট সহ ট্র্যাকপ্যাডে বাঁদিকে বা ডানদিকে যাবেন।

আপনি উপরে বা নিচে গেলে, তালিকাটি উপরে বা নিচে স্ক্রল করবেন।

তাই আপনি যদি চশমা পরে এটি করার চেষ্টা করেন, যেমন এটি খুব একটা খারাপ নয়, তাই না?

কিন্তু আপনি যদি এটি করেন, তাহলে এটি খুব একটা ভালো অভিজ্ঞতা নয়।

তাই, আমরা আসলে যা খুঁজে পেয়েছি তা হল সবচেয়ে স্বাভাবিক মুভমেন্ট হল ট্যাপ করা, তবে চশমার পাশে সোয়াইপ করা।

তাই আমরা ব্যবহারকারীদের নিয়ে অনেক স্টাডি করেছি এবং তারা আসলে আশা করেন যে আপনি যখন অনুভূমিকভাবে সোয়াইপ করেন, তখন আপনি আসলে কন্টেন্ট অনুভূমিকভাবে সরান না, আপনি এটি উল্লম্বভাবে সরান।

আপনি যদি মনে মনে এটি চেষ্টা করেন, তাহলে আপনি এই সম্পর্কে ভাবতে পারেন, যেমন আপনি যখন এখানে সোয়াইপ করছেন, আপনার সামনে যদি কোনও তালিকা থাকে, যেমন এগিয়ে যাওয়া, আপনি তালিকার মাধ্যমে এগিয়ে যেতে পারেন বা তালিকার মাধ্যমে ফিরে যেতে পারেন।

তাই, আমরা টু-ডাইমেনশনাল ইনপুট নিচ্ছি এবং ওয়ান-ডাইমেনশনাল উপায়ে এটি নিয়ে ভাবার চেষ্টা করছি।

আর সেখান থেকেই প্রাইমারি মোশন অ্যাক্সিসের এই আইডিয়াটা এসেছে যে আপনি আড়াআড়িভাবে যেতে পারেন এবং এটি লম্বালম্বিভাবে যাবে।

তাই, আপনি ডিভাইসেই তা উল্লেখ করতে পারবেন।

আপনি বলতে পারেন, আরে, এটা তো সাধারণ ট্র্যাকপ্যাড নয়।

আমি সরাতে চাই আমি চাই প্রাথমিক দিকটি অনুভূমিক হোক এবং এটিই প্রধান, একমাত্র অক্ষ যার সাথে আমি যেতে চাই।

আর তাই সেখান থেকেই এটি এসেছে।

ঠিক আছে।

তাই, আমরা এই বিষয়ে বেশ আশাবাদী।

Compose সবকিছু ম্যানেজ করছে।

এবং আপনার কাছে এই চমৎকার ভার্টিক্যাল ইমপ্লিমেন্টেশন আছে।

আপনি এই বিষয়ে ভাবতে পারেন।

সুতরাং, আমরা এটিকে কীভাবে ম্যাপ করেছি তা এখন আপনার কাছে অনুভূমিক সংজ্ঞার সাথে রয়েছে, আমাদের কাছে কেবল একটি এগিয়ে এবং পিছনে রয়েছে।

আমাদের কাছে উপরে, নিচে, বাঁদিকে, ডানদিকে নেই।

আমাদের শুধু সামনে ও পিছনে যাওয়ার বিকল্প আছে।

এবং তারপরে, আপনি যদি পরবর্তী এবং পূর্ববর্তী ফোকাসের সাথে পরিচিত হন তবে আমরা তা ম্যাপ করতে পারি।

তাই, এখন আমরা শুধু পরবর্তী ও পূর্ববর্তী আইটেমে যেতে পারি।

এবং এটি উল্লম্বের জন্য দুর্দান্ত কাজ করে।

আর এটা আরও সুন্দর।

এটি হরাইজন্টাল আউট-অফ-দ্য-বক্সের সাথে কাজ করে, তাই তো?

কারণ আপনার কাছে শুধু একগুচ্ছ ফোকাস করা আইটেম আছে।

আপনি শুধু পরবর্তী বা পূর্ববর্তী আইটেমে যান এবং এটি দুটির সাথেই কাজ করে।

তাই এটি Compose-এর একটি কেস যেখানে আমরা Compose-এ এই সব কিছু সংজ্ঞায়িত করেছি এবং খুঁজে বের করেছি, কিন্তু ডিভাইস নিজেই যদি বলতে পারে তবে এটি সত্যিই ভালো হবে, কারণ এটি জানে যে এটি একটি অদ্ভুত আকৃতি কিনা এবং এটি জানে যে এটি শুধুমাত্র এই প্রাথমিক অক্ষটি চায় কিনা, কিন্তু এটি সংজ্ঞায়িত করার কোন উপায় নেই।

তাই, এখন আমাদের এই ধারণাটি প্ল্যাটফর্মে ফিরিয়ে নিয়ে যেতে হবে এবং বলতে হবে, ঠিক আছে, আমাদের এটি প্ল্যাটফর্মে সংজ্ঞায়িত করতে হবে যাতে আমরা এটিকে স্ট্যান্ডার্ডাইজ করতে পারি এবং এই ডিভাইসগুলি নিজেরাই এটি নির্দিষ্ট করতে পারে, যাতে Compose এটিকে পুরোপুরি সাপোর্ট করতে পারে।

সুতরাং, এমন একটি ঘটনা ঘটেছে যেখানে আমরা Compose-এ কাজ করেছি এবং Compose-এ এগিয়ে গিয়েছি এবং পিছনের দিকে কাজ করেছি এবং এটিকে আমাদের সাথে নিয়ে এসেছি।

তাই, আমরা ঠিক সেটাই করেছি।

আমরা এই নতুন API তৈরি করেছি যাতে আপনি বা ডিভাইস তা নির্দিষ্ট করতে পারেন।

InputDevice.ViewBehavior
.getPrimaryDirectionalMotionAxis()

আর আপনার যদি মনে থাকে, আগে যখন আমি টাচ ইনপুট বা টাচ নেভিগেশন সম্পর্কে কথা বলছিলাম, তখন আমি বলছিলাম যে এটি মূলত টিভির জন্য তৈরি করা হয়েছে।

আমরা সেইসব প্রয়োগ বন্ধ করতে চাইনি।

তাই, এই নতুন ধরনের গ্লাস ইনপুট নির্দিষ্ট করার জন্য আমরা আরেকটি ফিল্ড যোগ করেছি।

ঠিক আছে।

তাহলে, শেষ পর্যন্ত, আপনার কাছে এর তাৎপর্য কী?

এটি হল জেসচার ডিটেক্টর হিসেবে আপনি যা পান তার আরও নির্দিষ্ট ভার্সন।

// Glimmer Library
Box(
    modifier =
        Modifier.fillMaxSize()
            .onIndirectPointerGesture(
                enabled = true,
                onSwipeForward = { /* onSwipeForward */ },
                onSwipeBackward = { /* onSwipeBackward */ },
                onClick = { /* onClick */ },
            )
            .focusTarget()
) {
    // App()

আপনি যদি Foundation ব্যবহার করেন, তাহলে এটি শুধু জেসচার ডিটেক্টরের সাথে কাজ করবে।

আমরা আপনার হয়ে এটি করেছি, তাই আপনাকে কিছু করতে হবে না।

তবে আপনি যদি চশমার জন্য কোনও অ্যাপ তৈরি করতে চান, তাহলে আমাদের Glimmer লাইব্রেরি ব্যবহার করতে পারেন এবং তারপরে আমাদের কাছে একটি বিশেষ জেসচার ডিটেক্টর আছে, যা আপনাকে শুধু, আপনি জানেন, তাই আপনাকে সেগুলি একত্রিত করতে হবে না, আপনি শুধু এটি ব্যবহার করতে পারেন, ক্লিক, ফরোয়ার্ড ফ্রেম এবং ব্যাক পেতে পারেন।

ঠিক আছে।

তাই, আমরা API-এর কাজ, প্ল্যাটফর্ম এবং Compose-এ কভার করেছি।

পরীক্ষা করার ব্যাপারে কী?

আপনি টাচ সংক্রান্ত টেস্ট করতে চাইলে, টাচ কেমন দেখায় তা এখানে দেখানো হয়েছে।

@Test
clickTest {

rule.onNodeWithTag(defaultTag)
.performTouchInput
{ click(center) }

}

আপনি শুধু performTouchInput বলবেন এবং তারপর একটি জেসচার দেবেন।

অনেক ধরনের জেসচার আছে এবং জেসচার যাতে কাজ করে তার জন্য আমরা ছোট ছোট ইভেন্ট তৈরি করি।

এটি কীভাবে কাজ করে?

আপনার কাছে Compose UI মডিউল এবং UI টেস্টিং মডিউল আছে এবং তারা MotionEvents ব্যবহার করে ইনপুট-ভিত্তিক যোগাযোগ করে।

এছাড়াও, UI টেস্টিং মডিউল একটি কিউয়িং মেকানিজম ব্যবহার করে, যা MotionEvent-এর উপর ভিত্তি করে তৈরি।

আমি আপনাকে এটি কেন বলছি?

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

কিন্তু আমি তা করেছি।

তাহলে, এর অর্থ আপনার জন্য কী?

আপনি যদি টাচ ইনপুট টেস্টিংয়ে অভ্যস্ত হন, তাহলে ইনডাইরেক্টের ক্ষেত্রে আপনি এটিই পাবেন।

আপনি শুধু নামের সাথে 'ইনডাইরেক্ট' যোগ করুন।

@Test
clickTest {

rule.onNodeWithTag(defaultTag)
// .performTouchInput
.performIndirectPointerInput (
IndirectPointerEventPrimaryDirectionalMotionAxis.X,
inputDeviceSize,
)
{ click(center) }
}

এখন, আমি করেছি, আমি কিছু অতিরিক্ত প্যারামিটার পাস করছি।

আপনি সম্ভবত প্রথমটি চিনতে পেরেছেন, যেখানে আপনি অনুভূমিকভাবে নির্দিষ্ট করেন।

এবং তারপর ইনপুট সাইজ অবশ্যই টাচপ্যাডের সাইজ হবে।

এখন, এটি খুব বেশি পরিবর্তন হয় না।

তাই, আপনি যদি সোর্স কোড দেখেন, তাহলে দেখতে পাবেন যে আমি শুধু একটি এক্সটেনশন ফাংশন লিখেছি এবং এটি দেখতে ঠিক এইরকম।

@Test
clickTest {

rule.onNodeWithTag(defaultTag)
// .performTouchInput
.performIndirectPointerInput
{ click(center) }

}

ঠিক আছে।

সুতরাং, এটি আপনাকে, আপনার ফ্রেম বা ইন্টেলিজেন্ট আইওয়্যারে ট্র্যাকপ্যাড সাপোর্ট করার জন্য আমরা যে সমস্ত কাজ করেছি তার একটি ধারণা দেবে।

তবে আমরা এগুলি করছি, আমি চোখ ও হাত ট্র্যাকিংয়ের জন্য এই এক্সারসাইজগুলি করছি, তাই আরও অনেক কিছু আসতে চলেছে।

তাই, এক নজরে, আমার অংশ থেকে আমি আপনাকে কী মনে রাখতে বলতে চাই?

তাই, আপনি ফোন বা চশমা বা অন্য কোনও ইনপুটের সাথে ট্র্যাকপ্যাড ব্যবহার করছেন কিনা, আমরা সেই বিষয়ে ভাবছি এবং সময়ের আগেই কাজ করার চেষ্টা করছি।

তাই, আপনি যদি এই Foundation জেসচার ডিটেক্টর ব্যবহার করেন, তাহলে এটি কোনও সমস্যা ছাড়াই কাজ করে।

সেটা হল এক নম্বর।

দ্বিতীয়ত, Compose হল প্রাথমিক UI টুলকিট এবং আমরা প্ল্যাটফর্ম ও টুলকিট, দুটিতেই নতুন ইনপুট টাইপ এক্সপ্লোর ও সাপোর্ট করা চালিয়ে যাব, যা আপনি দেখতে পাচ্ছেন যে আমি এখানে করেছি।

এবং তারপর, অবশ্যই, API পরীক্ষা করার জন্য, আমি একটি পরিচিত সারফেস এবং প্যারাডাইম বজায় রাখতে চাই যাতে আপনার পক্ষে এই নতুন ধরনের API মাইগ্রেট করা এবং পরীক্ষা করা যতটা সম্ভব সহজ হয়।

ধন্যবাদ, আশা করি এটি সহায়ক হয়েছে।