Ticket Q204094
Visible to All Users

How to change a property editor's font size and color in ASP.NET

created 16 years ago

Hi,

How can i change the color of a detail view item's caption (in web)?
I tried from the Application Model and even form the code (accessing the ASPxStringPropertyEditor) but all i can edit is the editor control.
Thank You!

Answers

created 16 years ago (modified 10 years ago)

Hello Gerardo,

To change a font used inside a property editor, get the underlying control as shown in the Access Editor Settings topic and customize it as required. Here is an example:

C#
public class ChangePropertyEditorFontController : ObjectViewController<DetailView, Contact> { protected override void OnActivated() { base.OnActivated(); WebPropertyEditor firstNameEditor = (WebPropertyEditor)View.FindItem("FirstName"); firstNameEditor.ControlCreated += firstNameEditor_ControlCreated; } void firstNameEditor_ControlCreated(object sender, EventArgs e) { WebPropertyEditor propertyEditor = (WebPropertyEditor)sender; WebControl editor = propertyEditor.ViewEditMode == ViewEditMode.Edit ? propertyEditor.Editor : propertyEditor.InplaceViewModeEditor; if (editor != null){ editor.ForeColor = Color.Yellow; } } protected override void OnDeactivated() { base.OnDeactivated(); WebPropertyEditor firstNameEditor = (WebPropertyEditor)View.FindItem("FirstName"); firstNameEditor.ControlCreated -= firstNameEditor_ControlCreated; } }

To change a font used for a property editor's caption (outside the property editor), use the WebLayoutManager.ItemCreated event, as shown below:

C#
public class ChangePropertyEditorCaptionController : ObjectViewController<DetailView, Contact> { protected override void OnActivated() { base.OnActivated(); ((WebLayoutManager)View.LayoutManager).ItemCreated += ChangeLayoutGroupCaptionViewController_ItemCreated; } void ChangeLayoutGroupCaptionViewController_ItemCreated(object sender, ItemCreatedEventArgs e) { if (e.ViewItem is PropertyEditor && ((PropertyEditor)e.ViewItem).PropertyName == "FirstName") { e.TemplateContainer.Load += (s, args) => { if (e.TemplateContainer.CaptionControl != null) { e.TemplateContainer.CaptionControl.Font.Size = new FontUnit(10); } }; } } protected override void OnDeactivated() { base.OnDeactivated(); ((WebLayoutManager)View.LayoutManager).ItemCreated -= ChangeLayoutGroupCaptionViewController_ItemCreated; } }

Thanks,
Anatol

    Comments (3)
    Anatol (DevExpress) 16 years ago

      Hello Gerardo,
      In XAF Web applications, the Literal control is used to display captions in DetailView. This control doesn't support changing background and text color. To accomplish your task, you need to replace this control with another, for example, the Label control, as shown in the following code:

      C#
      public class ViewController1 : ViewController { public ViewController1() { TargetViewId = "DomainObject1_DetailView"; } protected override void OnActivated() { base.OnActivated(); View.ControlsCreated += new EventHandler(View_ControlsCreated); } void View_ControlsCreated(object sender, EventArgs e) { WebPropertyEditor propertyEditor = (WebPropertyEditor)((DetailView)View).FindItem("Name"); TableCell cell = ((TableRow)((Control)propertyEditor.Control).Parent.Parent).Cells[0]; Literal literal = (Literal)cell.Controls[0]; literal.Visible = false; Label label = new Label(); label.ForeColor = Color.Red; label.Text = literal.Text; cell.Controls.Add(label); } }

      You can also mark the required field with bold text. In this case, you don't need to use the ViewController and change the control, because the Literal control supports this functionality out of the box. Simply decorate the caption of the corresponding detail view item in the Model Editor with the <b> tag.
      Please let me know in case of any difficulties.
      Thanks,
      Anatol

        Hi

        Is there a way of changing the background color using the Model Editor?

        Thanks!!

        Anatol (DevExpress) 8 years ago

          In the current version, the recommended way to change the background color is to use the Conditional Appearance module. It is possible to declare Conditional Appearance rules in the Model Editor - see Declare Conditional Appearance Rules in the Application Model.
          Alternatively, you can extend default model nodes with the BackColor property and change controls based on this property. See more information about this approach here: How to: Extend the Application Model.

          Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

          Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.