Sun. Oct 24th, 2021

Requirement: I have an af:inputFile component for which I want to change the default style and for this I will be using be Skinning feature of Oracle ADF.

Solution: For the solution of the above requirement follow the steps as shown below:

Step 1: Create an ADF Fusion Web Application.

Step 2: Create a demo.jspx page.

Drag and drop af:inputFile and set label=”Browse and Select”

Thus, the complete code for the demo.jspx page is shown below.

<?xml version='1.0' encoding='UTF-8'?>
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" version="2.1" xmlns:f="http://java.sun.com/jsf/core"
          xmlns:af="http://xmlns.oracle.com/adf/faces/rich">
    <jsp:directive.page contentType="text/html;charset=UTF-8"/>
    <f:view>
        <af:document title="demo.jspx" id="d1">
            <af:form id="f1" usesUpload="true">
                <af:inputFile label="Browse and Select" id="if1"/>
            </af:form>
        </af:document>
    </f:view>
</jsp:root>

Step 3: Create a skin1.css file and write the below code in the skin1.css file.

@charset "UTF-8";
/**ADFFaces_Skin_File / DO NOT REMOVE**/
@namespace af "http://xmlns.oracle.com/adf/faces/rich";
@namespace dvt "http://xmlns.oracle.com/dss/adf/faces";

af|inputFile {
    background-color: Aqua;
    border-radius: 10px 10px 10px 10px;
    padding: 10px;
}

af|inputFile::label {
  font-weight:bold;
  color:Blue;
}

af|inputFile::content {
    color: Maroon;
    font-weight: bold;
    border-color: #79bc79;
    border-style: solid;
    border-width: thin;
    border-radius: 5px 5px 5px 5px;
    padding: 5px;
    background-color: #d6ffd6;
}

Save all and run the application. Thus, the ran application is shown below:

Click on Choose File and select the file. Thus, the af:inputFile after selecting the file will look as below.

Hence, the solution to our requirement.

If you like the post please comment, share, and do join me on Facebook. Please subscribe to my YouTube Channel for video tutorials.

Thanks & Regards,
Susanto Paul

 606 total views,  4 views today

By Susanto Paul

Susanto is an Oracle ACE, a qualified MCA, MBA, and a highly-skilled Senior Oracle Specialist. He is an enthusiastic Blogger and YouTuber who helps learners to solve their complex problems more efficiently. He has 9+ years of experience in multiple technologies like AWS, Oracle ADF, Oracle APEX, Oracle JET, Oracle VBCS, Oracle IDCS, Oracle PL/SQL, Oracle Integration Cloud, Java, JDBC, Servlets, JSP, Spring, Hibernate, HTML5, CSS3, JavaScript, TypeScript, NodesJS, Angular, MySQL, Oracle WebLogic Server, JUnit, JMeter, Selenium Web Driver, etc. He is a certified: Oracle Certified Professional Java SE 6 Programmer, Oracle ADF 11g Certified Implementation Specialist, Oracle Cloud Platform Application Integration 2020 Certified Specialist, Oracle Cloud Infrastructure Foundations 2020 Certified Associate, and Oracle Cloud Infrastructure Developer 2020 Certified Associate

Leave a Reply

Your email address will not be published. Required fields are marked *