cancel
Showing results for 
Search instead for 
Did you mean: 

How can I add text to a unified ShellHeadItem?

Former Member
0 Kudos

Hi!

I am new to UI5..I tried to add text to a unified ShellHeadItem but it's not working. Apparently I can add only icons...How can I fix this?

Thank you in advance

Accepted Solutions (1)

Accepted Solutions (1)

former_member213386
Active Participant
0 Kudos

Hi Shirli,

in case you have not found a solution yet and still want one: for some other reason i got interested in the shell too, and first thought, this one's solvable with a custom ShellHeadItem. It seems not, because ShellHeadItem has no own renderer, but gets rendered by the ShellHeader. So i tried a bit to find a workaround, here it is (see comments in code): http://jsfiddle.net/sok_/3nnwfouk/

Still note, it is a workaround, it relies on the current dom structure of the shell header + items, which might change.

I think, the "official way" would be to provide an own Header (there is a setter for a custom Header in the shell) that suits your needs.

best regards, Sophie.

PS: make sure you don't get arrested by the UI police 😉 as they seem not to have intended texts in the shell header....

Former Member
0 Kudos

Hello Sophie!

I just tried your proposed solution and it worked Also the comments were very helpful. Thanks a lot for that!

ps: I'm sure that the UI police will understand this is a necessary intervention

Former Member
0 Kudos

Hi

I have tried your solution in the JSFiddle. But unfortunately i'm unable to get the text in the header. Its pointing an error as "oShell.getHeader is not a function". Please help me in resolving this issue.

Thanks in advance

-Moulika

former_member213386
Active Participant
0 Kudos

Hi Moulika,

might depend of the version of sapui5?

In my case it is sap.ui.version  "1.26.6"

You can also check the Shell object itself during runtime, or see the code directly at github openui5,

there you can see that shell uses itself the getHeader method.

https://github.com/SAP/openui5/blob/master/src/sap.ui.unified/src/sap/ui/unified/Shell.js

But as sapui5 currently evolves a lot (the different libraries), might be that in an older version the shell wasnt build like that?

best regards, Sophie.

Answers (2)

Answers (2)

former_member182862
Active Contributor
0 Kudos
Former Member
0 Kudos

Hi Shirli,

please share you code for more insights.

You could use http://jsbin.com/?html,output for sharing your code. Following template could be enhanced with your code.


<!DOCTYPE HTML>

<html>

    <head>

        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js"

                id="sap-ui-bootstrap"

                data-sap-ui-libs="sap.ui.commons, sap.m"

                data-sap-ui-theme="sap_goldreflection">

        </script>

        <!-- add sap.ui.table,sap.ui.ux3 and/or other libraries to 'data-sap-ui-libs' if required -->

        <script>

        <!-- your code goes here -->           

         

        </script>

    </head>

    <body class="sapUiBody" role="application">

        <div id="content"></div>

    </body>

</html>

Regards

Stefan

Former Member
0 Kudos

Hallo Stefan!

Please follow the link to check my code http://jsbin.com/bifadu/2/edit?html,output

Iam trying to add text to the "label" component. I hope you can suggest me a solution!

Thank you!

Former Member
0 Kudos

Hi Shirli,

Dennis already pointed to the documentation. It is not possible to add text.

If you try to describe a little more in detail, what you are trying to achive, there might be another solution.

Regards

Stefan