Apex 42 5 theme image files in the list of the Navigation menus

Environment: Apex 5 / 12 c/Linux

Theme 42 - Menu Navigation

I'm trying to configure the Navigation Menu to use images in the directory of the East (or #WORKSPACE_IMAGE #) rather than the css fontawsome images.  The help in the Navigation Menu panel shows that the option to use fontawsome css images or images of file system is controlled in the list template.  However, I can find no documentation on how the template must be configured to control this option.

I copied the side Menu of Navigation list model with a new model (picture Menu in the side Navigation) and the Navigation Menu to use this new list (under User Interfaces).  I tried various constructions in the new model based on the construction of li JQuery for example replace the HTML for the list template in the sense of: -.

"< li characteristics-current ="true"data-id =" "#A01 #" unable to read the data = "#A02 #" data-icon = "false" >

"< a href =" "#LINK #" title = "#A04 #" > < img src = "#IMAGE #" / > #TEXT_ESC_SC # < /a > < /li >

However this is made with a fake fontawesome class and the img tag is removed.

Various other html constructs fail, which suggests that a flag is somewhere that is needed to indicate to the Apex renderer to use images of filesystem rather than fontawesome classes.  It doesn't seem to be a global setting or the option to configure this.

Any ideas?  Or the development team would provide advice?

Thank you.

HI Paul,.

Have understood you things by yourself very well.

You are right that change the markup for the list to be used by widget tree side navigation will not affect the markup generated client side. It is similarly of the menu widget. The tree and the menu widgets are JavaScript data-driven. The markup simple list is just a way to let the models list APEX to create menus or trees. The markup simple list gets transformed into a JavaScript data which are then used to create widgets. The treeView widget and the widget menu cannot use the img tags to display icons.

Say that 5 APEX uses FontAwesome icons or even the icons of fonts is a little too specific. APEX 5 uses CSS to specify icons. This includes using images and CSS sprite images as long as they are specified in the CSS. Based on the options you give, I think that you understand the situation. In addition to background images 64 Basic, you can use other background images as well. For example, an image of the CSS sprite comes with jQuery UI, and is at your disposal. Or you can use a single image. You can create your own images to sprite.

Take a look at this simple demo application where I used some of the icons of the sprite CSS UI jQuery as well as some images from the APEX.

https://Apex.Oracle.com/pls/Apex/f?p=81996:1

I created a file called my_sprites.css and transferred as a static application file. Then I added it to the user interface of office under CSS files:

#APP_IMAGES #my_sprites.css

Here are its contents:

body .a-TreeView .ui-icon.fa,
body .a-TreeView .mi-icon.fa {
    display: inline-block;
    margin: 0 12px;
    vertical-align: middle;
    padding: 0;
    height: 16px;
    width: 16px;
}

body .a-TreeView .mi-icon.fa {
    height: 20px;
    width: 20px;
}

.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content .ui-icon.fa,
.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content .mi-icon.fa {
    display: inline-block;
    margin: 0 12px;
    vertical-align: middle;
    padding: 0;
    height: 16px;
    width: 16px;
}

.t-TreeNav .a-TreeView-node--topLevel > .a-TreeView-content .mi-icon.fa {
    height: 20px;
    width: 20px;
}

.mi-icon {
    height: 20px;
    width: 20px;
    display: inline-block;
}

.mi-icon-calculator {
    background-image: url("/i/htmldb/icons/pt_computation.png");
}

.mi-icon-piechart {
    background-image: url("/i/htmldb/icons/pt_piechart.png");
}

The navigation tree side force the type icon "f" then the fa class is added to all icons. If the CSS overrides some properties for the fa class. Some other special css is necessary for when icons are in a tree. For the menu icons, I entered "mi-icone mi-icone-Calculator" for example Image/class field.

I hope that this help show how to use other types of icons CSS.

Kind regards

-John

Tags: Database

Similar Questions

  • What default set to see the image files in the preview pane?

    I have something changed and did not know what effect.  What I place to be able to view the image files in the preview pane?

    So Sorry! I already have the choice of the preview pane and above to display a thumbnail of the pictures. Now all I get is the icon for each image Windows Photo Viewer, even in the preview pane.  I actually click the icon and photo viewer opens.  I'm looking for an image, it can get a lot of your time.

    According to your modified question, please refer to the link that I copy below.

    http://answers.Microsoft.com/en-us/Windows/Forum/Windows_7-files/Windows-7-Windows-Explorer-preview-pane-does-not/ff4bfb88-FC3B-444e-A036-027b97822cb3?msgId=5651fe7c-b7c1-433B-9814-e343def97303
  • "No Image file in the line of subtitle script" - Adobe Encore CS6

    I'm a beginning of work with Adobe Encore CS6. I'm looking for a resolution how to import a .fab file in Adobe Encore. When I import the file .fab and choose the location of the folder of the image file, a pop-up window shows "No Image file in the line of subtitle script" despite the fact that there are image files in the folder. What should I do? Any suggestion would be great!

    I think that the spaces in the file names of your image is shaking again. He sees the first space, reads the name of your picture as "Océans", and cannot find any file named Oceans. You can try to edit the script file to put the image file name in quotes, but I don't know if it will work.

    You can also rename the actual image names to remove the spaces (and I would like to delete the hyphens and use points out), so: Oceans2a_English_test0007.png and then edit the script file for new names.

    A colon in your time code, I think that mark in nondrop.

  • Windows 8.1 in Adobe Illustrator, I tried to copy my design &amp; tried to paste it, but after sticking the image (file), now the color looks different, drive and lighter. So, kindly inform how to paste the file with 100% same resolution / color / appeara

    Windows 8.1 in Adobe Illustrator, I tried to copy my design & tried to paste it, but after sticking the image (file), now the color looks different, drive and lighter. So, kindly inform how to paste the file with 100% same resolution / color / appearance. Thank you.

    Hi GANESHKUMARAPILLAI CHRYSTELLE,.

    Here is a link for color management workflows in Illustrator.

    It is best to place the image instead of paste into Illustrator. When you paste the images they are in RGB color format. Make sure your document is a RGB file

    Click on these links for more information.

    Understand the workflow of the CC of individual course Illustrator color management: Advanced

    Creative Suite * keeping colors consistent

    Implement the print color management workflow. Illustrator, InDesign, Photoshop

    Concerning

    Scott

  • Download the image file from the server

    Hi I want to download the image file of the server.

    When you download a file save dialogue comes. I don't want this dialog box.

    There will be a specific location where this file is saved.

    Can someone help me?

    Thank you

    CK

    You can not download the file without saving dialog file - it is a security restriction.

  • Where the photos are normally stored on a Mac computer? In the folder images in the Finder on my Mac, I see a file called "Library.photoslibrary Photos" i.e. 28.52 GB but I also have about 160 other image files in the same folder. But in pictures,.

    Where the photos are normally stored on a Mac computer? In the folder images in the Finder on my Mac, I have a file named "Library.photoslibrary Photos" i.e. 28.52 gb and another folder called 'iPhoto Library.migratedphotolibrary' i.e. 4.95 GB, but then I have also on the 160 other photo and video files in the same folder. But in my Photos app, it says that I have 6 260 'elements '.

    The pictures that you have imported into the photo library are, by default, stored inside the package (not file) "Library.photoslibrary Photos" in your pictures folder. The 'iPhoto Library.migratedphotolibrary' package would contain photos that have been stored in your library, iPhoto at the time of the migration.

    The other files in the pictures folder are that: other files. Also, they can be in libraries if you imported and has not deleted the copies lying around in the images.

  • Try to remove a CD image file, get the error message "this action cannot be completed because the file is open in another program.

    I am trying to remove a file from CD image (.img) of my office

    When I try to put it in the bin I get the message

    "The action cannot be completed because the file is open in another program close the file, and then try again"

    First, I checked the obvious things like if the .img file was mounted in a virtual drive - it isn't so I then used LockHunter to find which application is using the file so I can close by the Task Manager.

    Unfortunately LockHunter told me that the file is used by 'System' - which cannot be closed through the TM.

    Any help?

    The problem is that the program that allows you to mount the image always uses the image.  In my case I used the magical disc. Go to the start menu find the magic disk or folder folder, there should be an option to uninstall the magic disc. I tried UN-installing conrtol add and remove programs but it wouldn't let me. You can also click on computer in Start menu and see if the file you want to remove is always mounted (appears as a CD image). In this case that you can click the eject disc hit.

  • Embed the image file in the installation of the objects support script

    Hi everyone knows the way?

    I thank in advance.

    Edward

    Hi Edward,.

    Are you waiting for install images in your application for grouped with the installation script for the action of the export? then follow this procedure...

    Home > Application Builder > Application 102 > supporting objects > create the install Scripts->->
    -> Create Scripts to install files
    -> Check all
    -> Create script

    Export tab = Yes.

    When you export the application that contains objects supporting > Scripts Installation and then your application workspace imported will have the image file embedded.

    If you want more group acronym installation script for an image and then copy the code once you perform the steps above and paste.

    Thank you
    Mark Wyatt

  • Presets are not active, IE when I roll the cursor over them, nothing changes in the navigation panel, and when I click on one, nothing changes. Can anyone help. Thank you.

    Hello

    I installed LR CC last week and I'm working through the tutorials. My Presets are not active. When I roll over the presets with the cursor, nothing changes in the navigation panel. If I click on one, nothing happening either. Can anyone help?

    Try to uncheck the option preferences > performance > CPU graph use.  There is an obscure bug that causes presets do not display correctly.  Not sure if it will affect, but it is easy to try.

    If this does not help, try to reset the preference of LR: reset the lightroom - updated - Lightroom Forums preferences file.  LR soils is not uncommon of preferences, and when that happens, their reset may fix a surprising number of behaviors wobbly.

  • Location of Image files for the themes?

    Where can I find image for downloaded windows themes and default files?  I would like to copy the images and use them for other topics, too.

    Where can I find image for downloaded windows themes and default files?  I would like to copy the images and use them for other topics, too.

    Hello

    C:\Windows\Web\Wallpaper\

    C:\Users\yourusername\AppData\Local\ Microsoft\Windows\Themes\

    C:\Windows\Globalization\MCT\

    You can also find tons of new themes here: Gallery - gadgets, wallpapers and Windows 7 themes for customization

    Hope this helps,

    Thank you for using Windows 7

    Ronnie Vernon MVP

  • Cannot add image file to the current folder

    2 days ago my Qde always ok, but now I can copy images on the active folded. but my application cannot recognize that images and return

    Invalid asset ...
    Image not found ...
    

    error. I think that my qde had some problem. Anyone have idea?

    work on 10.0, 10.1, 10.2 or switch force and back?

    your assets.index is maybe corrupted

    Try this:

    Quit Momentics

    go into your file system project and delete assets/.assets.index

    reopen Momentics

    do a refresh

    and clean up the project

  • How to write image files in the current folder in the Release version

    I'm able to do in the sims and on real devices in debug mode, but for some reason when I'm building a Release version I can not write in the current folder. I get write errors.

    I want to write the image easily in qml files in this folder as read when I write in the current folder.

    Write to the data directory instead - unable to write to the application folder & active

  • The name of the Image file in the preview full-screen bridge to expose?

    While in the "full preview screen" if I enter '5' on the numeric keypad of the file name and five stars appear in the lower left of the screen.

    Is it possible to display the name of the file without getting a label value?  (if the image was already evaluated, entering a '5' would replace the original image side)

    Thank you!

    Brian

    You must watch slide show preferences (Ctrl + Shift + L) and change the caption to compact or full, then you'll see the info.

  • I can't save an Image file on the local disk

    Hello, I'm under this simple app to save an image on a local disk.

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
    <mx:Script>
    <![CDATA[
    
         import mx.core.UIComponent;
         import mx.graphics.ImageSnapshot;
         import mx.controls.Alert;
         import mx.rpc.events.FaultEvent;
         import mx.rpc.events.ResultEvent;
         import mx.graphics.codec.JPEGEncoder;
         import mx.events.ColorPickerEvent;
         import mx.controls.Alert;
         
         
         import flash.display.Sprite;
         import flash.events.*;
         import flash.net.FileReference;
         import flash.net.URLRequest;
         import flash.net.FileFilter;
         import flash.net.FileReferenceList;
    
    
         public var aux1:int = 1;
         public var file:FileReference;
    
        private function capture():void{
              var jpgEncoder:JPEGEncoder = new JPEGEncoder();
              var bitmapData:BitmapData = new BitmapData(image.width, image.height);
              bitmapData.draw(image);
              var ba:ByteArray =  jpgEncoder.encode(bitmapData);
              
              file = new FileReference();
           file.save(ba,"image.jpg");
                
         }
    
    ]]>
    </mx:Script>
    
         <mx:Image id="image" maxHeight="600" maxWidth="800"/>
            <mx:Button label="Save file" click="capture()"/>
    
    </mx:Application>
    

    But when a running the application, in this line:

    file.save(ba,"image.jpg");

    I get this error:

    "1061: call to a method may not set save through a reference with satic type flas .net: FileReference.

    Please, what can I do?

    Thanks in advance,

    Pedro

    The feature that you want to use is specific FP10, to access, you need to include the playerglobal.swc of FP10 in your construction. FlexBuilder should do this automatically if you go to project-> properties-> Flex compiler and "Need Flash Player Version" value 10 or later.

    You can find versions 9 or 10 playerglobal.swc in "\frameworks\libs\player\". If I remember correctly, the first version of the SDK supported by FP10 was 3.2.

  • image file on the link

    Tried to build a custom query. Find the example on thread Prev which will display the link conditional on prod_id which is a primary key.
    Select case when prod_zone in (1, 2, 3) then ' {a href = "f? p =' || : APP_ID | ' : 11 :' || : SESSION_ID.
    ': P11_PROD_ID:' | prod_id | '"}' || prod_id | '{a}' prod_id end prod_id else,.
    PROD_NAME, prod_zone, prod_quantity
    Table A

    ("My need: when prod_zone in 1,2,3, show link on the column prod_name icon but use the existing as apex icon < img src="/i/e.gif "alt ="├editer")

    Select
    case when prod_zone in (1, 2, 3) then ' {a href = "f? p =' || : APP_ID | ' : 11 :' || : SESSION_ID.
    ': P11_PROD_ID, P11_PROD_name:' | PROD_NAME | "'"}' | "< img src="/i/edit_big.gif "alt =" > | " '{a}'
    of another prod_name
    end prod_name,
    prod_id, prod_zone, prod_quantity
    Table A

    with the above query, I continued to get missing expression. Of course the img syntax won't but could not understand how, and more I can't put the prod_id in the right place. Can you help me?
    WAN

    Always post code encapsulated in.

    ...\
    

    Tags...

    It seems to be incorrect citing around the img element:

    select
              case
                when prod_zone in (1, 2, 3)
                then
                     '<a href="f?p='
                  || :APP_ID
                  || ':11:'
                  || :SESSION_ID
                  || '::::P11_PROD_ID,P11_PROD_name:'
                  || prod_name
                  || '">'
                  || '<img src="/i/edit_big.gif" alt="">'
                  || '</a>'
                else
                  prod_name
              end prod_name
            , prod_id
            , prod_zone
            , prod_quantity
    from
              foo
    

    (I'm guessing that your table is not actually called "table"... If you encounter more problems because of what is an Oracle reserved word: it should be changed as soon as possible.)

Maybe you are looking for