Discussion :

[npirard]

Bonjour,

j'ai une application Flex 4 et je souhaiterais, via CSS (ou Skin), pouvoir customizer la fenêtre "Alert". (Couleur de fonds, couleur de Police, ...).

Voici ce que je mets dans ma CSS

Code :

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

1
2
3
4
5
6
7
8
9
10
11
mx|Alert 
{         
	color: black;                
	font-size: 18;         
	title-style-name : "title";         
}     
.title     
{         
	color: black;               
	font-size:12;     
}

Mais Rien ne se passe, j'ai tj les écritures en blancs...

Est-ce que qlq à déjà eu le problème? Comment doit-on s'y prendre pour customizer l'Alert?

Merci

[Jim_Nastiq]

salut,

Peux tu me montrer comment tu appelles ton css et un peu de code stp ?

[npirard]

Code :

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

1
2
3
4
5
6
7
8
9
10
<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009" 
			xmlns:s="library://ns.adobe.com/flex/spark" 
			xmlns:mx="library://ns.adobe.com/flex/mx" 
			minWidth="955" minHeight="600" xmlns:component="component.*">
	<fx:Declarations>
 
	</fx:Declarations>
	<fx:Style source="css/style.css" />
	<component:Toto/>
</mx:Module>

L'appel à la CSS fonctionne bien car les boutons, datagrid, panel et autre sont bel et bien Customizé. Il y a juste un problème avec le "Alert".

CSS :

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
mx|Panel{
	borderColor: #e2e2e2;
	borderAlpha: 1;
	highlightAlphas: 0.48, 0.29;
	headerColors: #ffffff, #e2e2e2;
	backgroundColor: #e2e2e2;
	titleStyleName: "mypanelTitle";
}
 
.mypanelTitle {
	color: #666666;
}
 
s|Panel{
	skin-class :ClassReference("fluence.lib.skins.panelSkin");
}
s|Button{
	skin-class :ClassReference("fluence.lib.skins.btnSkin");	
}
 
mx|Button {
	fillColors: #70644E, #70644E, #FFFFFF, #FFFFFF;
	fillAlphas: 1, 1, 0.75, 0.65;
	color: #ffffff;
	textRollOverColor: #70644E;
	theme-color: #70644E; /*BRUN*/
}
 
mx|ProgressBar{
	bar-color: #70644E; /*BRUN*/
}
 
mx|Alert 
{         
	color: black;                
	font-size: 18;         
	title-style-name : "title";    
}     
.title     
{         
	color: black;               
	font-size:12;     
}

[Jim_Nastiq]

Hum ... étrange, je ne vois pas ce qui ne colle pas.
As tu testé ta css sur un projet Flex indépendant, tout simple qui ne fait qu'afficher une alert ?


PS: Alert étendant la classe Panel, il y'a peut être une subtilité à ce niveau, vérifie en commentant ton css affectant ton Panel

[npirard]

Bonjour,

j'ai fait plusieurs tests et voici ce qui se passe.

Si je fais une CSS uniquement avec le Alert dans mon application rien ne se passe.
Mon application et gérée via des Skins dans Flex 4. (Un fichier .as relié dans la css avec son Skin mxml). Ce qui veut dire que le Alert.Show se fait dans une fonction Action Script.

Je viens de créé un nouvelle application "test" mxml dans laquelle j'ai un bouton et lors du click je fais un Alert.Show.... et là, mon Alert est bein customizée.

Je reprend donc le code de cette CSS que je remet au niveau de mon autre application, et là toujours rien...

Etrange donc...

[npirard]

EUREKA!

Ca fonctionne.

En fait j'utilise mon application dans une application mère.
Certains composants prenneent les infos CSS de mon application et certain de mon application mère... dont Alert, qui n'était défini que dans ma sous application...

J'ai donc mis la même CSS au 2 niveau et Bingo... ça fonctionne!

Merci de votre aide!

[Jim_Nastiq]

Aaaah c'est un module ??!!

bon en tout cas merci d'avoir pris le temps de revenir pour partager la solution


PS: penses au tag résolu (bouton en bas de la discussion)