برنامه نویسی

آموزش بعدی Harmonyos: پنجره شناور جهانی

امروز من پنجره شناور را در توسعه Harmonyos با شما به اشتراک می گذارم.

برای ویندوز شناور ، برخی از دانش آموزان ممکن است در مورد اینکه آیا می توان از یک طرح آبشار استفاده کرد ، فکر کنند و ویندوز شناور را در برگه های مؤلفه نوار ناوبری مانند این جمع کنید:

Stack({alignContent:Alignment.BottomEnd}){
  Tabs({barPosition:BarPosition.End}){
    TabContent(){
      Text('page1')
        .fontColor(Color.Black)
        .fontSize(40)
    }
    .tabBar(this.Tabbar())
    TabContent(){
      Page2()
    }
    .tabBar(this.Tabbar())

  }
  Row(){
   //这是悬浮窗
  }
  .width(60)
  .height(60)
  .borderRadius(30)
  .backgroundColor(Color.Blue)
} 
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

چنین چیدمان هنگام فشار به صفحه بعد از بین می رود ، بنابراین کار نمی کند.

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

windowStage.createSubWindow('floatWindow',(err: BusinessError, data) =>})  
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

پس از اتمام ایجاد ، می توانید اندازه ، موقعیت و محتوای پنجره شناور را تنظیم کنید. توجه داشته باشید که واحد در اینجا PX است و فقط انواع عدد صحیح مثبت قابل عبور است:

//尺寸
data.resize(300,300,(err: BusinessError) =>})    

//位置
data.moveWindowTo(400,400,(err: BusinessError) =>})    

//展示
data.showWindow((err: BusinessError) =>}); 
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

بعضی اوقات ممکن است نیاز به تنظیم پنجره شناور داشته باشید تا یک دایره باشد. روش این است که ابتدا به صفحه محتوای مربوطه بروید تا گوشه های گرد را تنظیم کنید و دریابید که هنوز یک پس زمینه سفید وجود خواهد داشت ، و سپس رنگ پس زمینه پنجره را به صورت شفاف تنظیم کنید. این روش به بهترین وجه در پاسخ به تماس SetUicontent تنظیم شده است:

data?.setWindowBackgroundColor('#00000000');    

حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

هنگامی که شما نیاز به بستن پنجره شناور دارید ، می توانید برای از بین بردن روش DestroyWindow تماس بگیرید:

window.findWindow(FloatUntil.windowName).destroyWindow()    

حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

موارد فوق روشهای متداول استفاده از ویندوز شناور است. به خاطر سهولت استفاده ، من به سادگی روش فوق را محصور کرده ام و می توانم نمایشگر ، حرکت ، بسته شدن و سایر عملیات ویندوزهای شناور را در یک خط کد تحقق بخشید:

import EntryAbility from "../entryability/EntryAbility";
import { BusinessError } from "@kit.BasicServicesKit";
import { display, window } from "@kit.ArkUI";
export class FloatUntil{
  static  screen_width = display.getDefaultDisplaySync().width
  static screen_height = display.getDefaultDisplaySync().height
  static float_size = 420
  static  float_positon_x = FloatUntil.screen_width - FloatUntil.float_size - 40
  static  float_positon_y = FloatUntil.screen_height - FloatUntil.float_size - 440
  static  windowName="floatWindow"
 static  creatAndShowSubWindow(){
    EntryAbility.gloabalWindowStage.createSubWindow(FloatUntil.windowName, (err: BusinessError, data) => {
      let errCode: number = err.code;
      if (errCode) {
        return;
      }
      //位置、尺寸单位是px,只支持正整数
      data.moveWindowTo(FloatUntil.float_positon_x, FloatUntil.float_positon_y, (err: BusinessError) => {
        let errCode: number = err.code;
        if (errCode) {
          return;
        }
        console.info('Succeeded in moving the window.');
      });
      data.resize(FloatUntil.float_size, FloatUntil.float_size, (err: BusinessError) => {
        let errCode: number = err.code;
        if (errCode) {
          return;
        }
      });
      //悬浮窗是否可触
      data.setWindowTouchable(true);
      data.setUIContent("pages/FloatWindow", (err: BusinessError) => {
        let errCode: number = err.code;
        if (errCode) {
          console.error('Failed to load the content. Cause:' + JSON.stringify(err));
          return;
        }
        console.info('Succeeded in loading the content.');
        //设置窗口背景色透明,只有在这调用才不会报错
        data?.setWindowBackgroundColor('#00000000');
        data.showWindow((err: BusinessError) => {
          let errCode: number = err.code;
          if (errCode) {
            console.error('Failed to show the window. Cause: ' + JSON.stringify(err));
            return;
          }
          console.info('Succeeded in showing the window.');
        });
      });
    })
  }
  static moveWindowTo(x:number,y:number){
    window.findWindow(FloatUntil.windowName).moveWindowTo(x,y)
  }
  static destroyFloatWindow(){
     window.findWindow(FloatUntil.windowName).destroyWindow()
  }
}
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا