Plugins Nativescript Responsive@proplugin/Nativescript平台css未触发重绘

我不太确定标题是否合适，因为我不知道“重新绘制”是否正确。尽管如此，我认为这意味着什么是清楚的

我正在使用插件“@proplugin/nativescript platform css”，并遵循了蒂亚戈的Alves-excellent

由于我使用angular，我需要main.tns.ts中的插件

import { platformNativeScriptDynamic } from 'nativescript-angular/platform';

import { AppModule } from '@src/app/app.module';

require( '@proplugins/nativescript-platform-css' );

platformNativeScriptDynamic().bootstrapModule(AppModule);

我正在根据设备宽度动态更改行和列：

HTML

<GridLayout (layoutChanged)="updateLayout($event)" horizontalAlignment="center" verticalAlignment="center" class="wrap-login100"
[class.phone]="gridLayout.isPhone" [class.tablet]="!gridLayout.isPhone"
row="1" 
[rows]="gridLayout.rows"
[columns]="gridLayout.columns">
  <StackLayout marginBottom="50" [col]="gridLayout.image.col" [row]="gridLayout.image.row" verticalAlignment="center" class="login100-pic">

更新方法

updateLayout(route) {
let width;
width = screen.mainScreen.widthDIPs;

  let gridLayout;
if (width < 1000) {
  gridLayout = {
    isPhone: true,
    columns: '*',
    rows: '*,2*',
    image: {
      row: 0,
      col: 0
    },
    form: {
      row: 1,
      col: 0
    }
  };
} else {
  gridLayout =  {
    isPhone: false,
  columns: '*,2*',
  rows: '*',
  image: {
    row: 0,
    col: 0
  },
  form: {
    row: 0,
    col: 1
  }
};
}
return gridLayout;
}

updateLayout（路由）{
让宽度；
宽度=screen.mainScreen.widthDIPs；
让网格布局；
如果（宽度<1000）{
网格布局={
是的，
列：“*”，
行：“*，2*”，
图片：{
行：0，
col:0
},
表格：{
行：1，
col:0
}
};
}否则{
网格布局={
iPhone:错，
列：“*，2*”，
行：“*”，
图片：{
行：0，
col:0
},
表格：{
行：0，
上校：1
}
};
}
返回网格布局；
}

当应用程序启动时，我触发了updateLayout方法，pp将正确绘制布局，无论是平板电脑还是手机。当我改变方向时，updateLayout方法也会被触发，返回相应的gridLayout对象，但屏幕上什么也没有发生

正如您在代码中看到的，我尝试使用角度区域，但没有改变

---

如果您有任何想法，我将不胜感激，因为我真的不知道该去哪里寻找…

博客假设您正在使用Core flavor，请参阅。这个插件应该与Playerly兼容，所以如果你仍然有问题，请分享playerly Sample.thks，@Manoj，我已经在跟踪链接中的文档了。我将尝试在Playgroind中重新创建它

updateLayout(route) {
let width;
width = screen.mainScreen.widthDIPs;

  let gridLayout;
if (width < 1000) {
  gridLayout = {
    isPhone: true,
    columns: '*',
    rows: '*,2*',
    image: {
      row: 0,
      col: 0
    },
    form: {
      row: 1,
      col: 0
    }
  };
} else {
  gridLayout =  {
    isPhone: false,
  columns: '*,2*',
  rows: '*',
  image: {
    row: 0,
    col: 0
  },
  form: {
    row: 0,
    col: 1
  }
};
}
return gridLayout;
}