标签: ionic
如何在Ionic的导航栏下面制作一个容器填满整个屏幕？
我想要一个iframe来填充导航栏下方的所有空间.我看到Ionic正在生成内联CSS并向html,body标签添加类,它还创建了div包装器.我不知道达到我想要的目的是什么.我需要为此使用一些预制的CSS类,还是自己编写？如果是这样,我该怎么做,不打破布局.
问题不是关于iframe,而是关于让容器填满导航栏下面的整个空间.
目前iframe占据全宽但只有150像素的高度,因为父容器的高度为150px.
我的应用程序基于(github的标签应用程序).
我的代码如下:
index.html的:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
</head>
<body ng-app="starter">
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view style="width: 100%; min-height: 100%; height: 100%;">
<!-- tab-map is shown here: -->
</ion-nav-view>
</body>
</html>
制表map.html:
<ion-view view-title="Map" style="width: 100%; min-height: 100%">
<div style="width: 100%; min-height: 100%">
<ion-content class="padding" >
<iframe src="../index.html" style="width: 100%; min-height: 100%">
</iframe>
</ion-content>
</div>
</ion-view>
目前它看起来像这样:
推荐指数
解决办法
查看次数
Cordova:LocalFileSystem未定义
我无法使cordova文件系统工作.我有一个具有以下依赖项的项目:
com.ionic.keyboard 1.0.3 "Keyboard"
org.apache.cordova.console 0.2.12 "Console"
org.apache.cordova.device 0.2.13 "Device"
org.apache.cordova.file 1.3.2 "File"
org.apache.cordova.file-transfer 0.4.8 "File Transfer"
在app.js我定义对控制器模块的依赖:
angular.module('starter', ['ionic', 'controllers']);
控制器代码基本上是这样的:
angular.module('controllers', [])
.controller('GalleryCtrl', function ($scope) {
function success() {...}
function error() {...}
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, success, error);
}
}
然后我得到的是:
LocalFileSystem is not defined
此外,requestFileSystem未定义.这种行为可能是什么原因？
我使用的是cordova 4.1.2和离子1.3.1.
编辑:这是相应的HTML标记:
<body ng-app="starter" ng-controller="GalleryCtrl">
<ion-nav-view>
<ion-slide-box id="slideBox">
<ion-slide ng-repeat="..."> <!-- details omitted -->
</ion-slide>
</ion-slide-box>
</ion-nav-view>
</body>
推荐指数
解决办法
查看次数
用于我的离子项目的最佳数据库
我正在寻找用于离子项目的最佳数据库.我希望用户在本地存储数据库,并选择将远程数据库的信息同步为付款选项.他们的数据将通过登录到他们的用户帐户来自任何设备.我一直在看firebase Couchdb和Parse,但不知道我该怎么做.我必须记住扩展我的应用程序.有什么最好的选择？
推荐指数
解决办法
查看次数
离子本地存储不能持久保存在设备上
我有个问题.当我在Chrome上运行我的应用时,由于网络浏览器的本地存储,数据是持久的.但是,当在模拟器上运行时,如果我杀了应用程序,数据就会被擦除.我已经读过localstorage它是一个非易失性存储主要用于存储简单数据.我的应用程序不需要数据库,本地存储绰绰有余.出现这种情况的原因是什么？
angular.module('ionic.utils', [])
.factory('$localstorage', ['$window', function($window) {
return {
set: function(key, value) {
$window.localStorage[key] = value;
},
get: function(key) {
return $window.localStorage[key];
},
setObject: function(key, value) {
$window.localStorage[key] = JSON.stringify(value);
},
getObject: function(key) {
return JSON.parse($window.localStorage[key] || '{}');
},
removeItem: function(key){
$window.localStorage.removeItem(key);
},
removeByIndex: function (index) {
$window.localStorage.removeItem($window.localStorage.key(index));
},
getByIndex: function (index) {
return JSON.parse(($window.localStorage.key(index)));
},
clear: function (){
$window.localStorage.clear();
}
}
}]);
推荐指数
解决办法
查看次数
如何检测离子项内元素的点击？
使用ion-list和ion-item,我无法检测到按钮或div等元素的点击.
例如,使用ng-click在此处不起作用:
<ion-list>
<ion-item ng-repeat="device in devices">
<div ng-click="deviceOption(device.id)"> CLICK HERE</div>
</ion-item>
</ion-list>
我尝试过使用ion-option-button,但它并不适合使用.
为什么我们不能用一个简单的离子按钮指令来检测离子项内的点击？
推荐指数
解决办法
查看次数
Android Project to Cordova插件 - 找不到/创建了R.java
这实际上是我第一个使用大量设备特性的Cordova插件之一.
上下文
我的android项目由以下部分组成:
- libs(供应商库,如libGoogleAnalyticsServices.jar或android-support-v4.jar)
- res(anim/drawable/values/xml ...)
- src(我的项目Java特定来源)
在android中,一旦项目被编译,就会创建一个特定的文件来处理我的所有项目定义和依赖项:com.myProject.R.java android项目引用了很多R.drawable(例如),因此需要导入com.myProject.R.java
我想将该Android项目用于Cordova插件.
因此,我为我的cordova插件创建了一个全新的目录: - 创建了我的节点界面 - 复制了我的Android Source - 更新了plugin.xml以引用mt文件/ intent ...
什么工作
随着创建的cordova插件,我将它添加到我现有的离子项目中.这个项目使用ANT进行构建,它已经有6个月了,还没有更新到gradle新的构建系统.
我手工复制了日食生成的R.java到ANT-BUILD com/myProject/R.java,我的项目工作正常.
这一步允许我们轻松地将完整的android项目导出到Cordova插件
什么行不通
Ionic已经更新了它的构建过程,现在正在使用Gradle.更新我的android平台后(用cordova平台rm android/cordova平台添加android)
我现在有很多以下错误(其他问题相同):
platforms\android\build\intermediates\res\debug\layout\main.xml:30: error: Error: No resource found that matches the given name (at 'text' with value '@string/vehicleDetailsDefaultTxt').
此问题与以下事实有关:我com.myProject.R.java没有在gradle构建中创建/生成,并且找不到引用对象.
我试图手动将R.java文件放入:
- 平台\ android\build\intermediates :(很多不同的目录) - 同样的问题
- platforms\android\build\generated\source\r\_ debug:这是文件应该是IMO但在打包之前,gradle清理目录
我该如何参考R.java？或者我该如何自动编译R.java？或者更好的是,我如何制作一个Android项目(带有布局/资源...)一个Cordova项目,以便我像以前一样阻止任何手动步骤？
请随时向我询问有关该问题的其他信息.我会尽快回答
推荐指数
解决办法
查看次数
Android模拟器中的应用程序错误问题"存在网络错误"
我添加平台android运行它后,在Android上运行离子应用程序
ionic emulate android -l -c
我不知道为什么会这样,它的android清单文件是:
<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1" android:versionName="0.0.1" package="com.greatdevelopers.hrstop" xmlns:android="http://schemas.android.com/apk/res/android">
<supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<application android:hardwareAccelerated="true" android:icon="@drawable/icon" android:label="@string/app_name" android:supportsRtl="true">
<activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:screenOrientation="portrait" android:theme="@android:style/Theme.Black.NoTitleBar" android:windowSoftInputMode="adjustResize">
<intent-filter android:label="@string/launcher_name">
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:label="@string/multi_app_name" android:name="com.synconset.MultiImageChooserActivity" android:theme="@android:style/Theme.Holo.Light" />
</application>
<uses-sdk android:minSdkVersion="10" android:targetSdkVersion="22" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
</manifest>
它向我展示了这个问题.任何解决方案请告诉我.
推荐指数
解决办法
查看次数
angularjs中的ui-view和离子中的ion-nav-view之间有什么区别？
正如您所知,ui-router我们使用角度ui-view来渲染html父亲html.根据这个:
<!-- index.html -->
<body>
<div ui-view="filters"></div>
<div ui-view="tabledata"></div>
<div ui-view="graph"></div>
</body>
js 文件:
$stateProvider
.state('report', {
views: {
'filters': { ... templates and/or controllers ... },
'tabledata': {},
'graph': {},
}
})
同样在Ionic框架中我们可以使用:
<ion-nav-view name="filters"></ion-nav-view>
有什么不同？
javascript angularjs angular-ui-router ionic-framework ionic
推荐指数
解决办法
查看次数
Cordova构建Windows错误 - 缺少Microsoft.WinJS.2.0
在过去的两个小时里,我一直在努力解决这个问题.我有一个简单的Ionic/Cordova应用程序,我在Android和iOS上工作.我添加了一个Windows平台,并尝试构建并获得以下错误:
找不到SDK"Microsoft.WinJS.2.0"
我正在使用Visual Studio 2015,并不是非常熟悉,但我尝试添加引用,但它不起作用.我尝试用npm安装WinJS,但是没有用.我不知道该怎么做.有任何想法吗？
推荐指数
解决办法
查看次数
离子android图标不同原始大小/比例
我在下面创建了一个简单的1024x1024 icon.png resources/:
然后我运行离子资源,我需要的所有图标都生成 resources/android/icon/
我的config.xml更改为:
<platform name="android">
<icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
<icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
<icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
<icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
<icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
<icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
<splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
<splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
<splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
</platform>
<icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
现在如果我看一下安装后的应用程序图标,看起来中间的数字更大,并且不考虑比率:
正如你所看到的,小红球变成了一个巨大的球,这是我不明白的东西,任何人都可以澄清这一点吗？
推荐指数
解决办法
查看次数