Problem:
Expected results:
Draw the trimmed text (consider increasing the DocumentProperties.MaxTabWidth property to compensate the … part) or increase the max tab width.
Solutions:
It is possible to customize the Document Manager using the Controller below. Refer to the Task-Based Help > How to: Access the Document Manager and DocumentManager - Tabbed View - How to trim header caption text articles for more information.
1. Text trimming:
C#using DevExpress.ExpressApp;
using DevExpress.ExpressApp.Templates;
using DevExpress.XtraBars.Docking2010;
using DevExpress.XtraBars.Docking2010.Views;
using DevExpress.XtraBars.Docking2010.Views.Tabbed;
using System;
namespace MainDemo.Module.Win.Controllers {
public class T629226_CustomizeTabPropertiesController : WindowController {
public T629226_CustomizeTabPropertiesController() {
TargetWindowType = WindowType.Main;
}
protected override void OnActivated() {
base.OnActivated();
Window.TemplateChanged += Window_TemplateChanged;
}
private void Window_TemplateChanged(object sender, EventArgs e) {
if(Window.Template is ISupportStoreSettings) {
((ISupportStoreSettings)Window.Template).SettingsReloaded += OnTemplateSettingsReloaded;
}
}
private void OnTemplateSettingsReloaded(object sender, EventArgs e) {
IFrameTemplate template = Window.Template;
if(template is IDocumentsHostWindow && ((IDocumentsHostWindow)template).DocumentManager != null) {
DocumentManager docManager = ((IDocumentsHostWindow)template).DocumentManager;
foreach(BaseView view in docManager.ViewCollection) {
TabbedView tabView = view as TabbedView;
if(tabView != null) {
tabView.DocumentProperties.MaxTabWidth = 200; // Our default value is 150, so needed to compensate the ... part.
tabView.AppearancePage.Header.TextOptions.Trimming = DevExpress.Utils.Trimming.EllipsisCharacter;
tabView.AppearancePage.Header.Options.UseTextOptions = true;
tabView.AppearancePage.HeaderHotTracked.TextOptions.Trimming = DevExpress.Utils.Trimming.EllipsisCharacter;
tabView.AppearancePage.HeaderHotTracked.Options.UseTextOptions = true;
}
}
}
}
protected override void OnDeactivated() {
Window.TemplateChanged -= Window_TemplateChanged;
if(Window.Template is ISupportStoreSettings) {
((ISupportStoreSettings)Window.Template).SettingsReloaded += OnTemplateSettingsReloaded;
}
base.OnDeactivated();
}
}
}
2. Increase the maximum tab width:
C#//...
private void OnTemplateSettingsReloaded(object sender, EventArgs e) {
IFrameTemplate template = Window.Template;
if(template is IDocumentsHostWindow && ((IDocumentsHostWindow)template).DocumentManager != null) {
DocumentManager docManager = ((IDocumentsHostWindow)template).DocumentManager;
foreach(BaseView view in docManager.ViewCollection) {
TabbedView tabView = view as TabbedView;
if(tabView != null) {
tabView.DocumentProperties.MaxTabWidth = Int32.MaxValue; // Our default value is 150.
}
}
}
}
//...
3. Do not allow long texts in the tab. For instance, in this particular case it is possible to change IModelClass > ObjectCaptionFormat from "{0:FullName} from the {0:Department} " to "{0:FullName} ". You may need to reset your tabbed layout settings for this change to take effect.
Hello,
As I mentioned in t he blog's comment section, I don't consider this a problem at all. If we look at the Edge and Chrome browsers, which use tabs as their main UI component, they both behave exactly like XAF is currently behaving (see attached picture). They both simply crop the title and show the full caption on tooltip. The only different is that Chrome has a neat little transparency effect on the right of the tab when the caption is too big.
Option #1 to add '…' either removes visible characters or tab area real estate if you extend the tab width. If you think the text cropping is not clear enough as it is, perhaps do it like chrome with a transparent transition?
Thanks,
Alex
We appreciate your feedback, Alex.