nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How change &quot;Sign In&quot; form in flex 3?

parvazparvaz

Hi
I,m working on flex 3, I want to customize "Sign In" form, but I did not find any solution.
for example I want to change "Please sign in to access..." to "please enter your personal code..." or something else.

Best regards
A.ponker

Find more posts tagged with

Accepted answers

parvazparvaz

Hi
I solved problem. many thanks. it is related to flex version.
many thanks for your good help.

All comments

RobertScheitlin__GISP

A.ponker,

This can be done two different ways:

Customize the LoginWindow.mxml that can be found in the arcgis_api_for_flex_3_0\ArcGIS_Flex\skins\src\com\esri\ags\skins\supportClasses folder from the AGS Flex API download and add it to your Flex Viewer project.
Localize the ESRIMessages.properties file so that you can change the text for the "loginWindow_info" string and add that file to your flex viewer project in the locale folder for your language choice. Details concerning that can be found here: http://help.arcgis.com/en/webapi/flex/help/index.html#//017p00000007000000 and the existing ESRIMessages.properties file can be found here: http://help.arcgis.com/en/webapi/flex/supportfiles/ESRIMessages.properties

Either way you have a little work ahead of you.

Don't forget to click the Mark as answer check on this post and to click the top arrow (promote).
Follow the steps as shown in the below graphic:

parvazparvaz

Hi, many thanks. I localized and add below lines to end of my flex viewer strings properties, but Sign In form did not change!!!!!!!!

What should I do for solving this problem?

# -- UI related messages for LoginWindow --
#
loginWindow_title=Login
loginWindow_info=Please log in to access {0} on {1}
loginWindow_username=Username
loginWindow_password=Password
loginWindow_OK=OK
loginWindow_loggingIn=Logging in....
loginWindow_cancel=Cancel
loginWindow_error=Invalid username/password. Please try again.
loginWindow_insecure=Your password will be sent unencrypted.

Regards
A.ponker

RobertScheitlin__GISP

A.ponker,

So you followed all the instructions in the link for localization as far as adding the modified ESRIMessages.properties file to your FlexViewer project in the locale folder in en_US?

parvazparvaz

Yes. my application has english language. and I added above lines to my en-us "viewer strings properties". Is that correct?

RobertScheitlin__GISP

A.ponker,

Nope not even close. Have you read any of the link I provided about localization?..

You need to click on the second link I provided and copy all the text from that link.
In Flex Viewer open the FlexViewer3.0\locale\en_US\ package in the package Explorer and right click and choose new>file
Name it ESRIMessages.properties
Paste the data from step 1 and then make the change to the login stuff.

parvazparvaz

Hi
I did this. But Sign In form has not text and description! I attached preview of my flex builder. I dont know is my "ESRIMessages.properties" position correct or not?

RobertScheitlin__GISP

A.ponker,

What do you mean "But Sign In form has not text and description!" Is the whole form missing the text now? I have tested the steps I outlined and am able to change the text.

parvazparvaz

Yes whole the form missing text. This is preview:

signIn_missing.jpg

parvazparvaz

Is there any different between flex 2.5 and flex 3? Because I,m using flex 3 and you are using flex 2.5?

parvazparvaz

Hi
I solved problem. many thanks. it is related to flex version.
many thanks for your good help.

DasaPaddock

You should use the 3.0 version of ESRIMessages.properties from:
http://resources.arcgis.com/en/help/flex-api/ESRIMessages.properties

CoryPoynter

Customize the LoginWindow.mxml that can be found in the arcgis_api_for_flex_3_0\ArcGIS_Flex\skins\src\com\esri\ags\skins\supportClasses folder from the AGS Flex API download and add it to your Flex Viewer project.

My question is where would you add the SigninWindow.mxml to your FlexViewer project so that it would execute? Basically I want to add a image under the title to the SignIn prompt that pops-up.

RobertScheitlin__GISP

Cory,

Most people just put customized skins in the src/com/esri/viewer/skins/ folder and then just add it to the default.css but the less difficult way is to create a new package with the exact location:

src\com\esri\ags\skins\supportClasses\ and then put the SignInWindow.mxml in there.

CoryPoynter

Thank you,

I already had it in the skins folder, however I am not sure if I should add it to the default.css in my FlexViewer package so that it will display the SignInWindow.mxml that I modified instead of the built-in SignInWindow in the agslib-3.0-2012-06-06.swc library or should I add it to the default.css in the agslib? And also in what function should I reference it as a skinClass?

RobertScheitlin__GISP

Cory,

Add this to the default.css in your Flex Viewer project.

@namespace skinComps "com.esri.ags.skins.supportClasses.*";
skinComps|SignInWindow
{
    skinClass: ClassReference("com.esri.viewer.skins.SignInWindow");
}

And that is it...

CoryPoynter

Wait, that was a completely different folder location. Here is my package details pertaining to the location of my SignInWindow.mxml file
[ATTACH=CONFIG]17000[/ATTACH]

Now what you told me to put in my default.css document has a path for the entire ags.skins.SupportClasses folder however im using the viewer file structure should I be using the com.esri.ags.skins file structure instead because currently its not referencing my modied mxml file when executing?

showPath.gif

deleted-user-vm26lpA887DR

Wait, that was a completely different folder location. Here is my package details pertaining to the location of my SignInWindow.mxml file
[ATTACH=CONFIG]17000[/ATTACH]

Now what you told me to put in my default.css document has a path for the entire ags.skins.SupportClasses folder however im using the viewer file structure should I be using the com.esri.ags.skins file structure instead because currently its not referencing my modied mxml file when executing?

Did you ever figure out a solution from this point? This question is where I am also.

MattiasEkstrom

Maybe it's a bad idea to pick up an old thread that's already marked as answered, but I'm trying to use my own modified version of the SignInWindow.mxml, but don't know how I should point it out in the default.css file. Roberts suggestion does not work for me.
I've been able to do this with some other skins, for example the PopUpRenderer.

RobertScheitlin__GISP

Mattias,

The way I personally add a skin from the Flex API is to use the real Flex API package path and NOT just put them in the src\com\esri\viewer\skins. So for the signin window right click on the com.esri.viewer and choose new package and paste com.esri.ags.skins.supportClasses and finish. Now you can paste the SignInWindow.mxml in this new package folder and you will not have to use any css change at all because the file is in the exact package that the API is expecting it to be in. I just tested this again in a clean Viewer app and it worked flawlessly.

DasaPaddock

SignInWindow.mxml isn't actually a skin so it can't be set as a skinClass in CSS. By placing your version in your src folder at the same location as in the API, the Flex compiler will use it instead. (This is sometimes called "Monkey Patching".)

The other way to use a custom class it to set IdentityManager.signInWindowClass:
http://resources.arcgis.com/en/help/flex-api/apiref/com/esri/ags/components/IdentityManager.html#signInWindowClass

MattiasEkstrom

Thank you Robert and Dasa for making it clear for me. It works perfectly.

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.