You are here:   Forum
Register   |  Login

 

Forum Notice

This Forum is ARCHIVE only
For LightSwitch questions,
please use the official forums at:

http://social.msdn.microsoft.com/forums/en-US/lightswitch/threads


Forums

Rounding Button Corners
Last Post 28 Mar 2012 12:46 PM by kbrownfield. 1 Replies.
AddThis - Bookmarking and Sharing Button Printer Friendly
  •  
  •  
  •  
  •  
  •  
Sort:
PrevPrev NextNext
You are not authorized to post a reply.
Author Messages
KirkUser is Offline
New Member
New Member
Send Private Message
Posts:4
Avatar

--
21 Mar 2012 06:27 PM
    Does anyone know how to round the corners of Lightswitch buttons?  By buttons, I mean the regular buttons in a screen, not the command bar buttons on the ribbon control nor the buttons in a Datagrid.  I believe the normal way would be to create a theme containing a implicit style for TargetType="Button" and a ControlTemplate with an outer Border using CornerRadius. I tried that with a style for Button in Jan Van Der Haegen's ExtensionsMadeEasy. I also tried it using my own theme extension. But neither will actually change the style for the buttons in a Lightswitch project--I still get the same ole standard rectangular Lightswitch buttons.

    Finally, I tried creating my own button control extension and, of course, I can certainly set a specific style for it, but I would like it to use the selected Lightswitch theme for brushes, but I can't figure out how to reference a dynamic theme's resource dictionary either.

    Can anyone point me in the right direction?  Any idears would be greatly appreciated.
    KirkUser is Offline
    New Member
    New Member
    Send Private Message
    Posts:4
    Avatar

    --
    28 Mar 2012 12:46 PM
    I finally figured out how to get my Lightswitch button corners rounded.  With a little prompting from Derek Spurlock (if you don't already have the Spursoft Lightswitch Extensions, go get them!), I discovered that if you want to provide style resources beyond colors and fonts, you must have a class that implements IThemeExtension.

    If you follow Microsoft's Walkthrough: Creating a Theme Extension, you will find that you start with a theme XAML file that contains the fonts and color resources for your theme.  You will also find a theme class implementing ITheme that looks something like this:

    Imports System
    Imports System.ComponentModel.Composition
     
    Imports Microsoft.LightSwitch.Theming
     
    Namespace Presentation.Themes
     
        <Export(GetType(ITheme))>
        <Theme(MyTheme.ThemeId, MyTheme.ThemeVersion)>
        Friend Class MyTheme
            Implements ITheme
     
    #Region "ITheme Members"
     
            Public ReadOnly Property ColorAndFontScheme As Uri Implements ITheme.ColorAndFontScheme
                Get
                    Return New Uri("/MyThemeExtension.Client;component/Presentation/Themes/MyTheme.xaml", UriKind.Relative)
                End Get
            End Property
     
            Public ReadOnly Property Id As String Implements ITheme.Id
                Get
                Return MyTheme.ThemeId
                End Get
            End Property
     
            Public ReadOnly Property Version As String Implements ITheme.Version
                Get
                Return MyTheme.ThemeVersion
                End Get
            End Property
     
    #End Region
     
    #Region "Constants"
     
            Friend Const ThemeId As String = "MyThemeExtension:MyTheme"
            Friend Const ThemeVersion As String = "1.0"
     
    #End Region
     
        End Class
     
    End Namespace

    You can then add a very basic button style with rounded corners to the bottom of your theme xaml file:

    <Style TargetType="Button" x:Key="DefaultButtonStyle">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border Name="ButtonBorder"
                           CornerRadius="4"
                           BorderBrush="{StaticResource ButtonBorderBrush}"
                           Background="{StaticResource ButtonBackgroundBrush}">
                        <ContentPresenter Content="{TemplateBinding Content}"
                                                  HorizontalAlignment="Center"
                                                  VerticalAlignment="Center"/>
                    < /Border>
                < /ControlTemplate>
            < /Setter.Value>
        < /Setter>
    < /Style>
     
    <Style TargetType="Button" BasedOn="{StaticResource DefaultButtonStyle}" />


    But if you run and test your extension now, the buttons in your test application will be unaffected by your added style.  To have your style used, you must add a new class to your theme_extension.client project that implements IThemeExtension:

    Imports System.ComponentModel.Composition
    Imports Microsoft.LightSwitch.Theming
     
    Namespace Presentation.Themes
     
        <Export(GetType(IThemeExtension))>
        <ThemeExtension(MyTheme.ThemeId)>
        Friend Class MyStyle
            Implements IThemeExtension
     
            Public Function GetControlStyleResources(themeId As String, themeVersion As String, modules As IEnumerable(Of Microsoft.LightSwitch.Model.IModuleDefinition)) As IEnumerable(Of Uri) Implements IThemeExtension.GetControlStyleResources
                Return New List(Of Uri) From {New Uri("/MyThemeExtension.Client;component/Presentation/Themes/MyTheme.xaml", UriKind.Relative)}
            End Function
        End Class
     
    End Namespace

    Now when you run and test your extension you will see that the buttons have the rounded-corner style!

    If you prefer, as I do, to use ExtensionsMadeEasy so you can modify your theme from inside your Lightswitch application, change the theme class to inherit from EasyThemeWithExtensionExporter instead of EasyThemeExporter and implement IThemeExtension:

    Imports ExtensionsMadeEasy.ClientAPI.Theme
    Imports Microsoft.LightSwitch.Theming
    Imports System.ComponentModel.Composition
     
    Namespace LightSwitchApplication
     
        Public Class MyTheme
            Inherits EasyThemeWithExtensionsExporter(Of MyTheme, MyTheme)
            Implements ITheme, IThemeExtension
     
            Public ReadOnly Property ColorAndFontScheme As Uri Implements ITheme.ColorAndFontScheme
                Get
                    Return New Uri(String.Format("/{0};component/Theme/{1}", Me.GetType.Assembly.FullName.Split(",")(0), "MyTheme.xaml"), UriKind.Relative)
                End Get
            End Property
     
            Public ReadOnly Property Id As String Implements ITheme.Id
                Get
                    Return "My Theme"
                End Get
            End Property
     
            Public ReadOnly Property Version As String Implements ITheme.Version
                Get
                    Return "1.0"
                End Get
            End Property
     
            Public Function GetControlStyleResources(themeId As String, themeVersion As String, modules As IEnumerable(Of Model.IModuleDefinition)) As IEnumerable(Of Uri) Implements IThemeExtension.GetControlStyleResources
                Return New List(Of Uri) From {New Uri(String.Format("/{0};component/Theme/{1}", Me.GetType.Assembly.FullName.Split(",")(0), "MyTheme.xaml"), UriKind.Relative)}
            End Function
     
        End Class
     
    End Namespace

    Either method will allow you to use your own styles for the buttons in Lightswitch.

    Kirk
    You are not authorized to post a reply.


    Latest Microsoft Visual Studio LightSwitch Forum Threads That Have Answers

    DropUp Menue for Buttons
    9/27/2016 8:04 AM
    Hello, I'm working on a HTML-Client Lightswitch project with VS 2013 and have a question. I am new in programming and designing and have no idea how to solve it. I have created some tables and screens and add commands in the command bar, but when I saw the result in browser I was wondering if it is possible to create a DropUp Menue where all the commands are inside, so that you have one button which show me the other commands. I have one button to add a record, one to delete it, one to search through my records and one to edit my records.If it is possible, I want one button "Options" which give me the possibility to choose between the other commands. I hope you understand me and can help me out. Regards, AHleonIT
    Read more...

    Hi, I'm not sure if submitting question in right forum (LightSwitch or TFS). In my company we have a solution developed in Visual Studio 2012 LightSwitch and into App.Server layer we consume an ApplicationDataService.svc (OData) and a WCF Service. I created a build definition into TFS to schedule a daily building and publishing of App. At first Build Definition worked perfectly but for some reasons it runs into an error whose log results shows among others, as follows: PrepareForBuild: Creando directorio "bin\Debug\". LSSvcGenerators: Quitando el directorio "C:\TFSAgent\_work\1\s\0-Development\OmniMerchant\OmniMerchant.Server\GeneratedArtifacts\GeneratedSvcFiles\". Creando directorio "C:\TFSAgent\_work\1\s\0-Development\OmniMerchant\OmniMerchant.Server\GeneratedArtifacts\GeneratedSvcFiles\". Generación completada Copiando el archivo de
    Read more...

    This is actually a note to the community, not a question. related archived & unanswered post If you attempt to post to a LOB field (CLOB, BLOB, NCLOB etc.), lightswitch will reply with an error because of the expected datatype. (ex: ORA-00932: inconsistent datatypes: expected - got NCLOB). This is because Lightswitch is expecting a RowVersion field for concurrency like in a SQL Server DB. A workaround is to modify the .lsml file for the table located in project folder > Server > DataSources > [your db name] > [your table name with LOB field]. Locate the table and add this tag '<UseForConcurrency />' under the field you use for the primary key. Lightswitch will now allow you to enter the data without the error. <KeyProperty Name="MyKeyField_PK" PropertyType=":Int32"> <KeyProperty.Attributes> <Hidden /> <Required /> <NotSearchable />
    Read more...

    i just learn LightSwitch and read some articles guide (like Beth Massi 's post...), follow some guide like https://blogs.msdn.microsoft.com/lightswitch/2012/01/12/drop-down-lists-tips-tricks-beth-massi/  .... In My Visual Stuido 2015, LightSwitch HTML, i dont find any control like "Data Modal Picker", just only "Detail Picker", and cant find option like "Support Search/Sorting", only Support Paging. So in my build html client "BrowseCities" page, when i click State, it popup list State,  but i cant see the Search option above the list  So.... my Visual Studio or my project missing something? or LightsSwitch doesn't support it to HTML Client?
    Read more...

    hello does anyone has a VS LightSwitch Security Admin running in the browser? i tryed it with the MVC version (see title, http://lightswitchhelpwebsite.com/Blog/tabid/61/EntryId/3281/An-HTML-MVC-LightSwitch-Security-Administration.aspx) from the LS help website. well this works so fare in the localhost in VS 2015, but in the published version in azure or local server the admin link does not appear when i log in as an admin. and when i use the direct URL to the admin page no users are listed even when they are in the SQL db! has anyone a Idee what the Problem is and how to fix this? thanks for your support marcel
    Read more...

    1234
    Microsoft Visual Studio is a registered trademark of Microsoft Corporation / LightSwitch is a registered trademark of Microsoft Corporation