我创建了一个用于测试Crosswalk Project的新项目
我正在尝试使用css文件加载一些内容，但css根本不起作用。
MainActivityFragment中的代码：
import android.support.v4.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import org.xwalk.core.XWalkPreferences;
import org.xwalk.core.XWalkSettings;
import org.xwalk.core.XWalkView;
/**
* A placeholder fragment containing a simple view.
*/
public class MainActivityFragment extends Fragment {
private XWalkView xWalkWebView;
private View mContentView;
private static final String page = "<html>\n" +
" <head>\n" +
"\n" +
" <link href=\"primary.css\" rel=\"stylesheet\" type=\"text/css\"/>\n" +
"\n" +
" <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\"/>\n" +
"\n" +
" </head>\n" +
"\n" +
" <body>\n" +
"\n" +
" <ol>\n" +
"<li>Harum aut nostrum</li>\n" +
"</ol>\n" +
"<ol>\n" +
"<li>Saepe aut non numquam</li>\n" +
"<li>Sed aliquid</li>\n" +
"<li>Quo rerum quia veniam dolore</li>\n" +
"<li>Doloribus dolores</li>\n" +
"<li>Excepturi adipisci ad enim consequatur</li>\n" +
"<li>Enim qui autem iure aut deserunt</li>\n" +
"<li>Minima natus ratione rerum officia</li>\n" +
"<li>Non sed et eveniet aut</li>\n" +
"</ol>\n" +
"<p><iframe width=\"840\" height=\"473\" src=\"https://www.youtube.com/embed/10r9ozshGVE?feature=oembed\" frameborder=\"0\" allowfullscreen></iframe></p>\n" +
"<p>Facere <a title=\"Qui.\" href=\"https://rohan.net/magnam-rerum-repudiandae-est-cupiditate-ea.html\">id</a> nemo. Quasi dolorem est et. Modi aperiam est magni. Necessitatibus non labore ut qui atque Aliquam modi dolores nulla odit. Placeat vel vel quia nisi distinctio. Dolores <a title=\"Reprehenderit dolor blanditiis.\" href=\"http://batz.org/maxime-totam-sed-voluptatum-explicabo-voluptas-distinctio\">porro autem rerum</a> ex. Consequuntur quia quia Quod voluptas dolorem accusamus nemo. Tempora nostrum iste qui vel Non esse aut aut ut ducimus. sit est sed ad. <a title=\"Eos minus.\" href=\"http://dooley.net/possimus-impedit-enim-ex-numquam-qui-esse\">unde quibusdam in tempore et</a> eum recusandae. Molestiae omnis harum consequatur officia. adipisci iure libero voluptatem necessitatibus est.</p>\n" +
"<p><img src=\"https://reviworx.com/~reviworx/dev/wp_frm/wp-content/uploads/2016/03/f46d91f8-8923-3a0a-a6f8-7413399aa33e.jpg\" alt=\"Totam voluptatem\" /></p>\n" +
"<h6>Minus corrupti explicabo amet aut suscipit. Porro rerum corrupti a</h6>\n" +
"<p><img class=\"alignright\" src=\"https://reviworx.com/~reviworx/dev/wp_frm/wp-content/uploads/2016/03/e3b46cb3-6f7c-383e-abc0-194e31ad37ee.jpg\" alt=\"Labore a adipisci in modi sunt\" /></p>\n" +
"\n" +
"\n" +
" </body>\n" +
" </html>";
public MainActivityFragment() {
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
mContentView = inflater.inflate(R.layout.fragment_main, container, false);
xWalkWebView = (XWalkView) mContentView.findViewById(R.id.xwalkWebView);
xWalkWebView.setInitialScale(1);
XWalkSettings settings = xWalkWebView.getSettings();
if(settings != null) {
// settings.setBuiltInZoomControls(true);
// settings.setSupportZoom(true);
settings.setDefaultFontSize(20);
// if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
//
// settings.setDisplayZoomControls(false);
//
// }
}
// xWalkWebView.load("https://crosswalk-project.org", null);
xWalkWebView.load(null, page);
// turn on debugging
XWalkPreferences.setValue(XWalkPreferences.REMOTE_DEBUGGING, true);
return mContentView;
}
@Override
public void onPause() {
super.onPause();
if (xWalkWebView != null) {
xWalkWebView.pauseTimers();
xWalkWebView.onHide();
}
}
@Override
public void onResume() {
super.onResume();
if (xWalkWebView != null) {
xWalkWebView.resumeTimers();
xWalkWebView.onShow();
}
}
@Override
public void onDestroy() {
super.onDestroy();
if (xWalkWebView != null) {
xWalkWebView.onDestroy();
}
}
}
这是我的css文件：
@font-face {
font-family: 'thesansarabic';
/* src: url('DejaVuSans.ttf'); This doesn't work */
/* src: url('fonts/DejaVuSans.ttf'); Neither is this */
src: url('file:///android_asset/fonts/thesansarabic-plain.otf'); /* but this does */
}
body {
font-size: small;
font-family: 'thesansarabic';
display: -webkit-box;
display: flex;
-webkit-box-orient: vertical;
flex-direction: column;
padding-top: 48px;
padding-right: 10px;
padding-bottom: 48px;
padding-left: 10px;
box-sizing: border-box;
/*direction: ltr;*/
}
img {
max-width: 100%;
width: auto;
height: auto;
}
/*iframe, video {
max-width: 100%;
}*/
/* Portrait */
@media screen
and (orientation: portrait) {
iframe, video {
max-width: 100%;
max-height 40%;
height: 250px;
}
}
/* Landscape */
@media screen
and (orientation: landscape) {
iframe, video {
max-width: 60%;
max-height 30%;
height: 200px;
}
}
注意：此代码适用于默认的android webview。
以下是我如何嵌入Crosswalk项目：
repositories {
maven {
url 'https://download.01.org/crosswalk/releases/crosswalk/android/maven2'
}
}
dependencies {
compile fileTree(dir: 'libs', include: ['*.jar'])
testCompile 'junit:junit:4.12'
compile 'com.android.support:appcompat-v7:23.2.1'
compile 'com.android.support:design:23.2.1'
compile 'org.xwalk:xwalk_core_library:17.46.448.10'
}
答案 0 :(得分：0)
我来自Crosswalk团队。我已经在本地复制了您的代码，它暂时是我们所知道的错误，您可以在此XWALK-6541中对其进行跟踪。如果你愿意，我可以为你提供另一种使用css的方法。你可以使用XWalkView.load("file:///android_asset/page.html", null)，它运行正常。如果您有任何其他问题，请告诉我。感谢。
答案 1 :(得分：0)
我们的开发人员已经解决了您的问题，您可以像file:///android_asset/一样添加XWalkView.load("file:///android_asset/", content);以使css正常工作，而无需在css文件中添加任何完整路径。 src: url('fonts/DejaVuSans.ttf');也会奏效。关于你在android上的第二个人行横道样本问题，你可以找到大多数android嵌入式apis＆＃39; embeddingapi或embeddingapi-async上的用例。它们是使用人行横道（sync＆amp; async）的两种方式。