【问题标题】:ionic 2 themeablebrowser icons are not displayingionic 2 themeablebrowser 图标未显示
【发布时间】:2017-02-16 08:08:29
【问题描述】:

我正在尝试使用可主题化的浏览器插件打开链接。我设法让它工作,但我无法显示图标?我尝试更改十六进制值,但没有帮助。下面是我的代码,

navigate() {
let options = {
 statusbar: {
     color: '#ffffff'
 },
 toolbar: {
     height: 44,
     color: '#2e6abf'
 },
 title: {
     color: '#ffffff',
     showPageTitle: true
 },
 backButton: {
     image: 'back',
     imagePressed: 'back_pressed',
     align: 'left',
     event: 'backPressed'
 },
 forwardButton: {
     image: 'forward',
     imagePressed: 'forward_pressed',
     align: 'left',
     event: 'forwardPressed'
 },
 closeButton: {
     image: 'close',
     imagePressed: 'close_pressed',
     align: 'left',
     event: 'closePressed'
 },
 customButtons: [
     {
         image: 'share',
         imagePressed: 'share_pressed',
         align: 'right',
         event: 'sharePressed'
     }
 ],
 menu: {
     image: 'menu',
     imagePressed: 'menu_pressed',
     title: 'Test',
     cancel: 'Cancel',
     align: 'right',
     items: [
         {
             event: 'helloPressed',
             label: 'Hello World!'
         },
         {
             event: 'testPressed',
             label: 'Test!'
         }
     ]
 },
 backButtonCanClose: true
};

let browser = new ThemeableBrowser('http://sparklms.com', '_blank', options);

  }

任何帮助将不胜感激。

谢谢

【问题讨论】:

标签: javascript typescript ionic-framework ionic2


【解决方案1】:

您可能需要先本地导入图像。 该项目的README 提到:

需要注意的一点是,所有图片资源都引用了原生资源包。所以所有的图片都需要先导入到原生项目中。在 Android 的情况下,将在 R.drawable 下查找图像名称。例如。如果图片名称为 hello_world,则引用 R.drawable.hello_world。

或者,它们提供了使用wwwImage 参数而不是image 参数的可能性(然后只需将图像放入www/assets/ 文件夹中)。

backButton: {
    wwwImage: 'images/back.png',
    wwwImagePressed: 'images/back_pressed.png',
    wwwImageDensity: 2,
    align: 'left',
    event: 'backPressed'
}

【讨论】:

  • 这么大的问题,如果我们为工具栏中的所有按钮都使用图像,并且我们想要由 ionicons 提供的本地按钮,我们该怎么做呢?因为现在如果 backButton 的图像是 image: 'back',什么都没有显示,这是我理解的原因,我不明白的是如何将这些本机图标添加到适用于所有平台的项目文件中。有什么帮助吗?
  • @NoahTanenholtz 我不确定是否有直接的方法可以做到这一点。 Ionicons 是 ionic 的“原生”,但在 themeablebrowser 的情况下,您仍然必须以某种方式链接它们(使用上述方式或将它们添加到 Xcode github.com/initialxy/…)。实现您想要的一种方法是将要使用的图标文件(您可以在此处找到它们:github.com/ionic-team/ionicons/tree/master/src/svg)添加到项目的图像文件夹中,并按照此处描述的方式链接它们。
  • 我也尝试使用 wwwImage 代替它,但它显示工具栏上的图标放大了很多。该图标是“closeButton”的 x,但其显示放大到中心。我尝试改变密度,但没有奏效。我应该在照片编辑器中手动更改像素大小还是做其他事情?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2017-09-28
  • 2017-04-08
  • 2019-01-05
  • 2016-10-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多