আমি কীভাবে ওয়ার্ল্ড হিলিং ওয়েভ এফেক্ট তৈরি করব?

Question

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

সুখের একটি বল ক্ষেত্র , আপনি যদি।

একটি কাস্টম ভিউতে ক্যানভাসে রেন্ডার করার সময় এটি কীভাবে পারফরম্যান্সলি সম্ভব সম্পন্ন করা যায়?

---

আপডেট: এটি আমার মাথায় কীভাবে কাজ করে তা এখানে:

    private int hModeX, hModeY;
    private float hModeRadius = 0.1f;
    private float hModeStart = 0;
    happyModeBg = Bitmap.createScaledBitmap(happyModeBg, getWidth(),getHeight(), true);
    hModeX = getWidth()/2;
    hModeY = getHeight()/2;

private void initHappyMode(Canvas canvas){
    hModeRadius = 75 * thread.getDelta();

    if(hModeRadius > 500) {
        hModeStart = timestep; //What is timestep?
    }

    //context.arc(x, y, radius, 0, 2 * Math.PI, false); <- your version
    canvas.save();
    canvas.drawArc(oval, startAngle, sweepAngle, useCenter, paint) // <- my version
    //context.clip(); <- dont know what this does or if there is an equivilant
    canvas.drawBitmap(happyModeBg, 0, 0, null);
    canvas.restore();
    //requestAnimationFrame(step); <- dont know what this does since I cant seem to find it for android

}

আমি canvas.drawArc()একটি বৃত্ত তৈরি করতে ব্যবহার করছি , তবে আমি অবশ্যই কিছু মিস করছি।

Comments

প্রযুক্তিগতভাবে একে ওয়ার্ল্ড হিলিং ওয়েভ

— ratchet freak

আমি

— 60fps-

আপনি কি দু'বার দৃশ্য উপস্থাপন করতে পারেন? নিরাময়কৃত সংস্করণের জন্য একবার মৃত সংস্করণের জন্য এবং তারপরে চেনাশোনা পুরো পর্দাটি coversেকে না দেওয়া পর্যন্ত ক্রমবর্ধমান বৃত্তে মৃতদের উপরে নিরাময় আঁকুন।

— ওল্ফগ্যাং স্কাইলার

আমি যা ভাবছি তা ধরণের। একটি বিটম্যাপ দিয়ে কীভাবে এটি যেতে হবে তা জানেন না। এবং আমি জানি যে সম্ভবত আরও ভাল উপায় আছে যেহেতু একবারে 2 বিজি সরবরাহ করা খুব ব্যয়বহুল

— সবুজ_কউই

আমি মনে করি যে বিভ্রান্তিটি ছিল তা আমি দেখেছি - অ্যান্ড্রয়েড CanvasHTML এর চেয়ে কিছুটা আলাদাভাবে কাজ করে <canvas>, যা আমি ভেবেছিলাম আপনি বোঝাতে চেয়েছিলেন! কিছু অ্যান্ড্রয়েড-নির্দিষ্ট লিঙ্ক এবং উদাহরণ কোড সহ ক্লিপিং কীভাবে সাধারণভাবে কাজ করে তা ব্যাখ্যা করতে আমি আমার উত্তর সম্পাদনা করেছি।

— আনকো

Answer 1

ডেমো

^{GameDev মেটা : ট্রান্সফর্মেশন প্রধান !! : ডি}

কোডটি একটি canvas clipঅঞ্চল ব্যবহার করে এবং requestAnimationFrameসর্বোচ্চ মানের এবং দক্ষতার জন্য। (এটা ভাল লাইভ ।)

আমি ধরেছি আপনি এইচটিএমএল বোঝানো হয়েছে canvas! এমনকি যদি আপনি না করেন তবে অন্যান্য রেন্ডারিং ইঞ্জিনগুলি (যেমন অ্যান্ড্রয়েডের 2 ডি রেন্ডারিং পাইপলাইন, যার অর্থ আপনি বোঝাতে পারেন) এছাড়াও হার্ডওয়্যার-এক্সিলার্ট ক্লিপ অঞ্চলগুলিকে সমর্থন করে । কোডটি সম্ভবত অনুরূপ দেখাবে।

requestAnimationFrame(বা অন্য প্ল্যাটফর্মের সরবরাহিত সমাধান) সহ অ্যানিমেশন ফ্রেমের অনুরোধ করা ইঞ্জিনকে রেন্ডার সময় নির্ধারণ করে উচ্চ-মানের অ্যানিমেশনের ফলাফল দেয়।

এটি স্বল্প-পরিসরের নেটবুক এবং আমার অ্যান্ড্রয়েড ফোনে সহজেই রেন্ডার করে।

ব্যাখ্যা

এটিকে আরও সাধারণভাবে কার্যকর করতে, আসুন আমরা ক্লিপিংয়ের বিষয়টি বুঝতে পারি ।

ধরা যাক আমাদের দুটি আয়তক্ষেত্র রয়েছে:

ক্লিপিং লাইন, পয়েন্ট, চিত্র বা আপনি যে কোনও রেন্ডার করতে চাইতে পারেন ঠিক তেমন কাজ করে। আমি কেবল সরলতার জন্য আয়তক্ষেত্রগুলিতে আঁকছি।

আমরা চাই না যে লাল আয়তক্ষেত্রটি এখানে (কালো বৃত্ত) মোটেও দৃশ্যমান হোক।

সুতরাং আমরা সেই বৃত্ত দ্বারা লাল আয়তক্ষেত্রটি ক্লিপ করতে রেন্ডারকে নির্দেশ দিতে পারি ।

অন্য কথায়, যখন লাল আয়তক্ষেত্রটি আঁকানো হয়, সেখানে কালো বৃত্তটি যেখানে ছিল তা বাদ দিয়ে এটি সর্বত্র টানা হয়।

কোন অঞ্চল দ্বারা ক্লিপ করা উচিত তা নির্দিষ্ট করে দেওয়ার বিভিন্ন পদ্ধতি বিভিন্ন রেন্ডারারের রয়েছে। জাভাস্ক্রিপ্টে, এইচটিএমএল সহ <canvas>, আমি মূলত করেছি

// Draw the blue rectangle

context.save(); // Save the current state of the graphics context,
                // so we can go back to it.

// Draw the black circle
context.clip(); // Tell the renderer that was our clip region,
                // since the last `context.save()`.

// Draw the red rectangle.
// It will appear clipped by the black circle.

context.restore(); // Tell the renderer we should restore all
                   // the clipping settings back to what they were
                   // `context.save`d as.

// From here on, nothing is clipped anymore.

এখন, একটি অ্যান্ড্রয়েডে Canvas, আপনি একই রকম কাজ করতে চাইবেন তবে রেন্ডার কিছুটা আলাদা কোড আশা করে:

// Draw the blue rectangle

canvas.save(); // Same idea as above -- just setting a point we can
               // restore to later.

// Now, `canvas.clipPath` expects a `Path` object.
// Let's create one that contains a circle.
Path path = new Path();
path.addCircle(100, 100, 100, Direction.CW); 
canvas.clipPath(path);

// Draw the red rectangle
// It will be clipped by the circle defined in the `path` that we
// used as the `clipPath`.

canvas.restore(); // Aaaand restore the state.

// Things drawn here won't be clipped anymore.

বিষয়টি সম্পর্কে অ্যান্ড্রয়েড ডকুমেন্টেশনগুলি সহজ হতে পারে। মত ভাল প্রশ্ন আছে এই এক টি জিনিস আপনি এটি দিয়ে চেষ্টা করতে পারেন সম্পর্কে Stackoverflow উপর।

Answer 2

আনকোস পদ্ধতি ব্যবহার করে কাজ বাস্তবায়ন:

canvas.drawBitmap(depressingBg, 0, 0, null);
canvas.save();
radius += 400*thread.getDelta(); // expansion speed
Path path = new Path();
// draw around player position
path.addCircle(player.x, player.y, radius, Direction.CW);
canvas.clipPath(path);
canvas.drawBitmap(happyBg, 0, 0, null);
canvas.restore();

সমস্ত সহায়তার জন্য আঙ্কোকে ধন্যবাদ!