[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Collapse]eXpressApp Framework
 [Expand]Fundamentals
 [Expand]Getting Started
 [Expand]Concepts
 [Expand]Design-Time Features
 [Expand]Deployment
 [Collapse]Task-Based Help
  [Expand]Business Model Design
  [Expand]Application Model
  [Expand]Actions
  [Expand]Navigation
  [Expand]Views
  [Expand]List Editors
  [Expand]Property Editors
  [Expand]Templates
  [Expand]Filtering
  [Expand]Reporting
  [Expand]Dashboards
  [Expand]Scheduler and Notifications
  [Expand]Maps
  [Expand]Security
  [Expand]Workflow
  [Expand]Localization
  [Expand]Testing
  [Collapse]Miscellaneous UI Customizations
    How to: Add a Button to a Detail View Using Custom View Item
    How to: Add an XAF Mobile Custom Module
    How to: Adjust the Size and Style of Pop-up Dialogs (ASP.NET)
    How to: Adjust the Windows' Size and Style
    How to: Change an Application Logo and Info
    How to: Create a Custom Control Detail Item
    How to: Customize a Window Caption
    How to: Customize ASP.NET Layout Elements Using Custom CSS Classes
    How to: Customize Export Options of the Printing System
    How to: Customize the Conditional Appearance Module Behavior
    How to: Customize Window Status Messages (WinForms)
    How to: Enable High DPI Support in a WinForms Application
    How to: Implement a Custom Messaging Class
    How to: Implement Client-Side Logic in Mobile Applications
    How to: Include an Action to a Detail View Layout
    How to: Raise XAF Callbacks from Client-Side Events and Process these Callbacks on Server
    How to: Set Images and Captions for Enumeration Values
    How to: Show a Custom Window with an Embedded XAF View
    How to: Show a Custom Windows Form
    How to: Use a Custom Plugin in a Mobile Application
    How to: Use a Custom Splash Screen
    How to: Use a DevExtreme Chart in a Mobile Application
    How to: Use Custom Themes in ASP.NET Applications
  Frequently Asked Questions (FAQ)
 [Expand]API Reference
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

How to: Change an Application Logo and Info

This topic describes how to change the default logo and text displayed in a WinForms application's About window, in the top-left and bottom-right corners of an ASP.NET application's main page, and in a Mobile application's AboutInfo Detail View. In WinForms, ASP.NET and Mobile applications, you can use an embedded resource image as a logo. You can also use an image file from a web application's folder.

Note

In WinForms applications, the About window is invoked using the AboutInfoController.AboutInfoAction Action and contains the AboutInfo object's Detail View (AboutInfo_DetailView). In ASP.NET applications, the AboutInfoControl is used to display the info. In Mobile applications, you can access the AboutInfo object's Detail View (AboutInfo_DetailView) from the About navigation item.

Expanded Specify the Application Info

In the Model Editor, you can specify information about the application name, description, vendor, copyright and version formatting using the following properties or the root Application node:

Expanded Use an Embedded Resource Logo Image

Tip

A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=E4721.

  • To use a custom logo, add it as an embedded resource. The steps below illustrate how to do this.

    1. Save your custom logo to the Images folder in the module project (for example, MySolution.Module\Images\CustomLogo.png).

      Important

      If your solution language is VB.NET, prefix the file name with the module assembly name and folder name. For example, to add a CustomLogo.png image to the Images folder of the MySolution.Module project, rename the image file MySolution.Module.Images.CustomLogo.png.

    2. In Solution Explorer, click the Show All Files toolbar button. Select the image added to the Images sub-folder, right-click it and choose Include In Project.
    3. Switch to the Properties window. Set the Build Action option to Embedded Resource.
  • Now you can assign the added image name to the IModelApplication.Logo property. Rebuild the solution and invoke the Model Editor. Focus the root Application node and click the Logo property's ellipsis button. In the invoked Image Gallery dialog, choose your logo.

    You can also type the image name manually instead of choosing it in the Image Gallery. When specifying the image name, omit the file extension (and prefix, if you use VB.NET).

    Note

    • In WinForms applications, the default logo is specified in the application Model Differences, so changes made in this step has no effect. To use the logo specified in the module Model Differences, open the Model.xafml file from the application project, navigate the Application node and delete the Logo property value.
    • In Mobile applications, an image specified in the Logo property is also used as the application's icon and is displayed on its splash screen.

  • To check that the logo has been changed in the WinForms application, run it and invoke the About window.

    Refer to the Application Personalization topic for more information on the About window.

  • Run the ASP.NET application to ensure that the custom logo is applied.

  • Run the Mobile application and tap the About navigation item to ensure that the logo image has been changed.

Expanded Use a Logo Image File from Web Application Folder

You can use a content file instead of a module's embedded resource in ASP.NET applications. To use a custom PNG image as a logo in a New Web UI, rename your file to Logo.png and copy it to the Images folder in the application project.

Follow the steps below to customize the logo image (use a custom file name, non-PNG format, adjust the image size):

  1. Open the Default.aspx.cs (Default.aspx.vb) file and add the Page_Init method to the Default class to handle the Page.Init event, and then subscribe to the BaseXafPage.CustomizeTemplateContent event.
  2. Cast the CustomizeTemplateContentEventArgs.TemplateContent parameter or BaseXafPage.TemplateContent property to the IHeaderImageControlContainer interface to access the template content.
  3. The template content exposes the ThemedImageControl using the HeaderImageControl property. Specify an image using the DefaultThemeImageLocation and ImageName properties of this control.

    This code demonstrates how to use an SVG logo in the New Web UI:

    As a result, the application logo is loaded from the CustomLogo.svg file in the ASP.NET application project's Images folder (for instance, MySolution.Web\Images\CustomLogo.svg).

    Important

    If your application has a logon form, make sure the following lines are present in the Web.config file:

Expanded See Also

Is this topic helpful?​​​​​​​