Utilisation du style JQuery mobile

**PP(Team)** · 05/07/2012, 17h16

Bonjour,

J'ai une question toute bête : est-il possible, sans passer par un WebView, d'inclure un fichier CSS ?

Le but est de surcharger le style par défaut d'Androïd pour y appliquer le style "JQuery mobile".

J'ai tenté de "feinter" et d'inclure un WebView qui ne contenait que l'appel aux fichiers CSS et JS, mais cela ne semble pas fonctionner.

Voici le code relatif à cette demande :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
 
package com.example.home.ihm;
 
import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.util.Log;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.widget.Button;
import android.widget.EditText;
import android.widget.RelativeLayout;
import android.widget.ScrollView;
import android.support.v4.app.NavUtils;
 
public class MainActivity extends Activity {
	private static final String TAG = "MyActivity Main";
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(
        	    RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
        	lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
 
        ScrollView view = (ScrollView) findViewById(R.id.webview);//layout.activity_main);
//        view.removeAllViews();
//        addContentView(view, lp);	
        setContentView(R.layout.activity_main);
        Log.v(TAG, "MAIN");
 
        WebView myWebView = (WebView) findViewById(R.id.webview);
        WebSettings webSettings = myWebView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        myWebView.loadUrl("file:///android_asset/www/header.html");
//        addContentView(myWebView, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT,
//        		ViewGroup.LayoutParams.FILL_PARENT));
        //On crée le Listener sur le Bouton
        OnClickListener ButtonConnexion = new OnClickListener()
        {
         @Override
         public void onClick(View actuelView)
         {
         // On met en place le passage entre les deux activités sur ce Listener
        	//On récupère les deux champs, puis le texte saisi
        	 EditText login = (EditText) findViewById(R.id.username);
        	 String loginStr = login.getText().toString();
        	 EditText pass = (EditText) findViewById(R.id.password);
        	 String passStr = pass.getText().toString();
 
        	 Intent intent = new Intent(MainActivity.this, DisplayLoginActivity.class);
        	 //On rajoute les valeurs à l’Intent
        	 // en tant qu’extra a ce dernier.
        	 // Les extras sont différenciés par un “id” (string)
        	 intent.putExtra("login", loginStr);
        	 intent.putExtra("password", passStr);
        	 startActivity(intent);
         }
        };
 
        //On récupere le bouton souhaité et on lui affecte le Listener
        Button bouton = (Button) findViewById(R.id.okbutton);
        bouton.setOnClickListener(ButtonConnexion);
 
      //On crée le Listener sur le Bouton
        OnClickListener ButtonSubscribe = new OnClickListener()
        {
         @Override
         public void onClick(View actuelView)
         {
         // On met en place le passage entre les deux activités sur ce Listener
        	//On récupère les deux champs, puis le texte saisi
//        	 EditText login = (EditText) findViewById(R.id.username);
//        	 String loginStr = login.getText().toString();
//        	 EditText pass = (EditText) findViewById(R.id.password);
//        	 String passStr = pass.getText().toString();
//        	  
        	 Intent intent = new Intent(MainActivity.this, SubscribeActivity.class);
//        	 //On rajoute les valeurs à l’Intent
//        	 // en tant qu’extra a ce dernier.
//        	 // Les extras sont différenciés par un “id” (string)
//        	 intent.putExtra("login", loginStr);
//        	 intent.putExtra("password", passStr);
        	 startActivity(intent);
         }
        };
 
        //On récupere le bouton souhaité et on lui affecte le Listener
        Button bouton_subscribe = (Button) findViewById(R.id.create_account);
        bouton_subscribe.setOnClickListener(ButtonSubscribe);
    }
 
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.activity_main, menu);
        return true;
    }
 
 
}

Sur cette partie, je ne parviens pas à ajouter 2 view l'une à l'autre grace à "addContentView".

Le fichier "activity_main.xml" :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
 
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 
		xmlns:android="http://schemas.android.com/apk/res/android"
		android:layout_width="fill_parent" 
		android:layout_height="fill_parent"> 
	<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 
	   android:orientation="vertical"
 
	   android:layout_width="fill_parent"
 
	   android:layout_height="fill_parent"
 
	   android:gravity="top">
	   <WebView  xmlns:android="http://schemas.android.com/apk/res/android"
	    android:id="@+id/webview"
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
		/>
 
	   <TextView
 
		        android:layout_width="fill_parent" 
 
		        android:layout_height="wrap_content"
 
		 		android:gravity="center"
 
		 		android:textStyle="bold"
 
		        android:text="@string/welcome_text" 
 
		        android:layout_marginTop="10dp"
 
	        /> 
	    <TextView
 
		        android:layout_width="fill_parent" 
 
		        android:layout_height="wrap_content"
 
		 		android:gravity="center"
 
		 		android:textStyle="italic"
 
		        android:text="@string/identify_text"
 
		        android:layout_marginTop="10dp"
 
	        /> 
	        <TextView  
 
	            android:layout_width="fill_parent" 
 
	            android:layout_height="wrap_content"
 
	            android:text="@string/username" 
 
	            android:layout_marginTop="15dp"
 
	        />
 
	        <EditText
 
	            android:id="@+id/username"
 
	            android:layout_width="fill_parent"
 
	            android:layout_height="wrap_content"
 
		        android:singleLine="true"
 
		        android:fadingEdge="horizontal"
 
		        android:layout_marginBottom="20dip"/>
 
	         <TextView
 
		        android:layout_width="fill_parent" 
 
		        android:layout_height="wrap_content"
 
		        android:text="@string/password"
	        />
 
	        <EditText
 
		        android:id="@+id/password"
 
		        android:layout_width="fill_parent"
 
		        android:layout_height="wrap_content"
 
			    android:inputType="textPassword"		
 
		        android:singleLine="true"
 
		        android:fadingEdge="horizontal" 
 
	        />
 
	        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 
		        android:orientation="vertical"
 
		        android:layout_width="fill_parent"
 
		        android:layout_height="fill_parent"
 
		        android:gravity="center">
 
 
 
	        <Button
 
	            android:id="@+id/okbutton"
 
	            android:layout_width="fill_parent"
 
	            android:layout_height="wrap_content"
 
	            android:text="@string/login"
 
	       />    
 
	        <Button
 
	           android:id="@+id/cancelbutton"
 
	           android:layout_width="fill_parent"
 
	           android:layout_height="wrap_content"
 
	           android:text="@string/cancel"
 
	       />
<!-- 	       <EditText -->
 
<!-- 	            android:id="@+id/text_create_account" -->
 
<!-- 	            android:layout_width="fill_parent" -->
 
<!-- 	            android:layout_height="wrap_content" -->
 
<!-- 		        android:singleLine="true" -->
 
<!-- 		        android:fadingEdge="horizontal" -->
 
<!-- 		        android:layout_marginBottom="20dip"/> -->
			<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 
		        android:orientation="vertical"
 
		        android:layout_width="fill_parent"
 
		        android:layout_height="fill_parent"
 
		        android:gravity="bottom">
		  <TextView
 
		        android:layout_width="fill_parent" 
 
		        android:layout_height="wrap_content"
 
		 		android:gravity="center"
 
		        android:text="@string/text_create_account" 
 
	        />
	        <Button
 
	            android:id="@+id/create_account"
 
	            android:layout_width="fill_parent"
 
	            android:layout_height="wrap_content"
 
	            android:text="@string/create_account"
 
	       />  
 
	    </LinearLayout>      
 
	</LinearLayout>
	</LinearLayout>
</ScrollView>

Le but est d'intégrer le fichier "header.html" suivant (dans "assets/www") :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<html>
<header>
<script type="text/javascript" src="scripts/jquery/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript" src="scripts/jquery/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="jquery.mobile-1.1.0.min.css">
</header>

Merci d'avance pour votre aide.

NB : désolé de cette question qui doit vous paraitre bête, mais j'ai commencé Androïd aujourd'hui ...

**nicroman** · 07/07/2012, 17h54

Je ne comprends pas....

L'interêt de jQuery mobile est de transformer une page HTML en un truc qui ressemble à une application native smartphone....

Si tu as une application native smartphone... quel interêt de vouloir utiliser jQuery mobile ? Autant utiliser directement l'UI du téléphone non ?

Utilisation du style JQuery mobile

Android

Discussions similaires

Partager

Partager