একটি Google স্লাইড উপস্থাপনায় অগ্রগতি বার দেখান

কোডিং স্তর : মধ্যবর্তী
সময়কাল : ১৫ মিনিট
প্রকল্পের ধরণ : এডিটর অ্যাড-অন

উদ্দেশ্য

  • সমাধানটি কী কাজ করে তা বুঝুন।
  • সলিউশনের মধ্যে অ্যাপস স্ক্রিপ্ট সার্ভিসগুলো কী কাজ করে তা বুঝুন।
  • স্ক্রিপ্টটি সেট আপ করুন।
  • স্ক্রিপ্টটি চালান।

এই সমাধান সম্পর্কে

আপনার প্রেজেন্টেশনের স্লাইডগুলোর নিচে একটি প্রোগ্রেস বার যোগ করতে এই সমাধানটি ব্যবহার করুন।

নীচে একটি অগ্রগতি বার সহ গুগল স্লাইডস প্রেজেন্টেশন।

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

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

অ্যাপস স্ক্রিপ্ট পরিষেবা

এই সমাধানটি নিম্নলিখিত পরিষেবাটি ব্যবহার করে:

  • স্লাইড পরিষেবা : একটি প্রেজেন্টেশনের স্লাইডগুলো সংগ্রহ করে এবং সেগুলোর প্রতিটিতে একটি আয়তক্ষেত্রাকার আকৃতি যোগ করে।

পূর্বশর্ত

এই নমুনাটি ব্যবহার করার জন্য আপনার নিম্নলিখিত পূর্বশর্তগুলো প্রয়োজন:

  • একটি গুগল অ্যাকাউন্ট (গুগল ওয়ার্কস্পেস অ্যাকাউন্টের জন্য প্রশাসকের অনুমোদনের প্রয়োজন হতে পারে)।
  • ইন্টারনেট সংযোগসহ একটি ওয়েব ব্রাউজার।

স্ক্রিপ্টটি সেট আপ করুন

  1. প্রোগ্রেস বার স্লাইডস প্রেজেন্টেশনটির একটি কপি তৈরি করতে নিচের বাটনটিতে ক্লিক করুন। এই সলিউশনের অ্যাপস স্ক্রিপ্ট প্রজেক্টটি প্রেজেন্টেশনটির সাথে সংযুক্ত করা আছে।
    একটি অনুলিপি তৈরি করুন
  2. প্রেজেন্টেশনে, এক্সটেনশন > প্রোগ্রেস বার > শো প্রোগ্রেস বার-এ ক্লিক করুন।
  3. অনুরোধ করা হলে স্ক্রিপ্টটিকে অনুমোদন দিন। যদি OAuth সম্মতি স্ক্রিনে ‘ এই অ্যাপটি যাচাই করা হয়নি ’ সতর্কবার্তাটি প্রদর্শিত হয়, তাহলে Advanced > Go to {Project Name} (unsafe) নির্বাচন করে এগিয়ে যান।

  4. আবার, এক্সটেনশন > প্রোগ্রেস বার > প্রোগ্রেস বার দেখান-এ ক্লিক করুন।

  5. প্রোগ্রেস বারটি সরাতে, এক্সটেনশন > প্রোগ্রেস বার > হাইড প্রোগ্রেস বার-এ ক্লিক করুন।

কোডটি পর্যালোচনা করুন

এই সলিউশনের অ্যাপস স্ক্রিপ্ট কোড পর্যালোচনা করতে, 'ভিউ সোর্স কোড'- এ ক্লিক করুন:

উৎস কোড দেখুন

slides/progress/progress.gs
/**
 * @OnlyCurrentDoc Adds progress bars to a presentation.
 */
const BAR_ID = "PROGRESS_BAR_ID";
const BAR_HEIGHT = 10; // px

/**
 * Runs when the add-on is installed.
 * @param {object} e The event parameter for a simple onInstall trigger. To
 *     determine which authorization mode (ScriptApp.AuthMode) the trigger is
 *     running in, inspect e.authMode. (In practice, onInstall triggers always
 *     run in AuthMode.FULL, but onOpen triggers may be AuthMode.LIMITED or
 *     AuthMode.NONE.)
 */
function onInstall(e) {
  onOpen();
}

/**
 * Trigger for opening a presentation.
 * @param {object} e The onOpen event.
 */
function onOpen(e) {
  SlidesApp.getUi()
    .createAddonMenu()
    .addItem("Show progress bar", "createBars")
    .addItem("Hide progress bar", "deleteBars")
    .addToUi();
}

/**
 * Create a rectangle on every slide with different bar widths.
 */
function createBars() {
  deleteBars(); // Delete any existing progress bars
  const presentation = SlidesApp.getActivePresentation();
  const slides = presentation.getSlides();
  for (let i = 0; i < slides.length; ++i) {
    const ratioComplete = i / (slides.length - 1);
    const x = 0;
    const y = presentation.getPageHeight() - BAR_HEIGHT;
    const barWidth = presentation.getPageWidth() * ratioComplete;
    if (barWidth > 0) {
      const bar = slides[i].insertShape(
        SlidesApp.ShapeType.RECTANGLE,
        x,
        y,
        barWidth,
        BAR_HEIGHT,
      );
      bar.getBorder().setTransparent();
      bar.setLinkUrl(BAR_ID);
    }
  }
}

/**
 * Deletes all progress bar rectangles.
 */
function deleteBars() {
  const presentation = SlidesApp.getActivePresentation();
  const slides = presentation.getSlides();
  for (let i = 0; i < slides.length; ++i) {
    const elements = slides[i].getPageElements();
    for (const el of elements) {
      if (
        el.getPageElementType() === SlidesApp.PageElementType.SHAPE &&
        el.asShape().getLink() &&
        el.asShape().getLink().getUrl() === BAR_ID
      ) {
        el.remove();
      }
    }
  }
}

অবদানকারীরা

এই নমুনাটি গুগল ডেভেলপার বিশেষজ্ঞদের সহায়তায় গুগল দ্বারা রক্ষণাবেক্ষণ করা হয়।

পরবর্তী পদক্ষেপ