sap.ui.commons.Panel 折叠/展开事件 [英] sap.ui.commons.Panel Collapse / Expanded event
问题描述
是否可以将事件添加到 SAPUI5 sap.ui.commons.Panel 的 最小化和最大化?我需要的是在单击面板的折叠或展开按钮时添加不同的样式.
is it possible to add an event to SAPUI5 sap.ui.commons.Panel's minimize and maximize? What i need is to add a different style when the Panel's collapse- or expand-Button is clicked.
如果用户点击减号，我必须添加一个样式类，比如 pnl.addStyleClass("XYZ"); 当用户点击最大化"时，应该添加一个不同的样式类面板 pnl.addStyleClass("ZYFDEFD");
If the user clicks on the minus-Symbol i have to add a styleclass like pnl.addStyleClass("XYZ"); when the user clicks on "maximize" a different styleclass should be added to the panel pnl.addStyleClass("ZYFDEFD");
如果我覆盖 .setCollapse- 或 .setExpanded-function 面板不再折叠或展开，所以必须找到其他东西.
if i overwrite the .setCollapse- or .setExpanded-function the panel doesn't collapse or expand anymore, so something else has to be found.
推荐答案
几个可能的选择...
1) 您可以使用根据展开状态添加到控件的标准样式类 (sapUiPanelColl) - 请参见下面的示例...
1) You could make use the standard style class (sapUiPanelColl) which is added to the control depending on the expanded state - see example below...
var oPanel = new sap.ui.commons.Panel({});
oPanel.addStyleClass("myPanel");
oPanel.placeAt("content");.myPanel { background-color: green; }
.myPanel.sapUiPanelColl { background-color: red; }<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>sap.ui.commons.Panel style class example</title>
</head>
<body id="content">
<script src="https://openui5.hana.ondemand.com/resources/sap-ui-core.js" id="sap-ui-bootstrap" data-sap-ui-theme="sap_bluecrystal" data-sap-ui-libs="sap.m,sap.ui.commons"></script>
</body>
</html>2) 或者，如果不需要使用公共库中的面板，您可以切换到 sap.m.Panel(作为 sap.ui.commons.Panel 自版本 1.38 起折旧)，然后使用 展开事件
2) Alternatively, if it's not essential to use the Panel from the commons library you could switch to sap.m.Panel (as the sap.ui.commons.Panel is depreciated since version 1.38) and then make use of the expand event
这篇关于sap.ui.commons.Panel 折叠/展开事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
