我创建了一个新项目进行测试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。
这是我嵌入人行横道项目的方式：
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'
}