1. #1
    Futur Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    juin 2017
    Messages
    12
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 20
    Localisation : France, Sarthe (Pays de la Loire)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Industrie

    Informations forums :
    Inscription : juin 2017
    Messages : 12
    Points : 8
    Points
    8

    Par défaut Changement de couleur conditionnel d'un textblock

    Bonjour à tous !

    Alors voilà, j'ai crée une appli qui permet d'afficher en temps réel des tensions et courants provenants de capteurs, grâce à un raspberry pi 3.

    Tout ceci fonctionne, mais maintenant, j'aimerais changer la couleur de mon affichage ( blanc --> rouge) quand les tensions et courants dépassent certains seuils. Jusqu'à présent, j'affiche à côté de ma valeur des points d'exclamations rouges, mais ca ,e fait pas très propre... En clair, je veux changer la couleur de propriétés bindées en fonction de leur valeurs...

    Une idée ???

  2. #2
    Rédacteur/Modérateur
    Avatar de François DORIN
    Homme Profil pro
    Consultant informatique
    Inscrit en
    juillet 2016
    Messages
    1 157
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Charente Maritime (Poitou Charente)

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : juillet 2016
    Messages : 1 157
    Points : 3 713
    Points
    3 713
    Billets dans le blog
    5

    Par défaut

    Bonjour,

    Quelle technologie utilise tu ? Winforms ? WPF ? Il serait bon de le préciser
    François DORIN
    Consultant informatique : conception, modélisation, développement (C#/.Net et SQL Server)
    Site internet | Profils Viadéo & LinkedIn
    ---------
    Page de cours : fdorin.developpez.com
    ---------
    N'oubliez pas de consulter la FAQ C# ainsi que les cours et tutoriels

  3. #3
    Futur Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    juin 2017
    Messages
    12
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 20
    Localisation : France, Sarthe (Pays de la Loire)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Industrie

    Informations forums :
    Inscription : juin 2017
    Messages : 12
    Points : 8
    Points
    8

    Par défaut

    Bonjour,

    Oups pardon petit oubli de ma part, je travaille sur Visual studio, et ce en xaml/C#.

  4. #4
    Expert éminent sénior Avatar de Pol63
    Homme Profil pro
    .NET / SQL SERVER
    Inscrit en
    avril 2007
    Messages
    12 738
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 35
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : .NET / SQL SERVER

    Informations forums :
    Inscription : avril 2007
    Messages : 12 738
    Points : 22 885
    Points
    22 885

    Par défaut

    Il suffit de binder backcolor à une propriété de type solidcolorbrush, et quand la valeur change changer la couleur (dependency property ou notifypropertychanged pour que ca soit mis à jour sur l'interface)

    Ou sinon binder backcolor à la valeur numérique et créer un converter (implémenter ivalueconverter) pour renvoyer un solidcolorbrush à partir d'une valeur


    Par contre xaml c# c'est pas forcément assez précis, wpf silverlight et uwp utilisent le xaml (xamarin.forms aussi je crois)
    Cours complets, tutos et autres FAQ ici : C# - VB.NET

  5. #5
    Membre confirmé
    Homme Profil pro
    Développeur informatique
    Inscrit en
    juin 2007
    Messages
    316
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : juin 2007
    Messages : 316
    Points : 467
    Points
    467

    Par défaut

    Ma suggestion serait d'ajouter une propriété indiquant qu'un seuil de danger est dépassé, puis de binding dessus un DataTrigger qui modifiera ton interface (par exemple en ajoutant un contour rouge) lors que sa valeur vaut true. Tu peux même combiner l'ensemble en un objet de données unique contenant toutes ces propriétés.

  6. #6
    Futur Membre du Club
    Homme Profil pro
    Étudiant
    Inscrit en
    juin 2017
    Messages
    12
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 20
    Localisation : France, Sarthe (Pays de la Loire)

    Informations professionnelles :
    Activité : Étudiant
    Secteur : Industrie

    Informations forums :
    Inscription : juin 2017
    Messages : 12
    Points : 8
    Points
    8

    Par défaut

    D'accord, l'idée du contour me paraît pas mal, tu fais ça comment ? ^^

  7. #7
    Membre confirmé
    Homme Profil pro
    Développeur informatique
    Inscrit en
    juin 2007
    Messages
    316
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : juin 2007
    Messages : 316
    Points : 467
    Points
    467

    Par défaut

    J'ai créé un projet WPF auquel j'ai ajouté les packages NuGet de MVVMLight.

    Avec le ViewModel suivant contenant la température, le seuil et une information sur le dépassement de seuil :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    namespace SimpleField.ViewModel
    {
        public class ValueReportViewModel : INotifyPropertyChanged
        {
            public event PropertyChangedEventHandler PropertyChanged;
     
            protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
            {
                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
            }
     
            public ValueReportViewModel()
            {
                PropertyChanged += (sender, args) =>
                {
                    switch (args.PropertyName)
                    {
                        case "Value":
                        case "UpperTreshold":
                            IsAboveUpperTreshold = Value > UpperTreshold;
                            break;
                    }
                };
            }
     
            private static bool CustomEquals(double d1, double d2)
            {
                double tolerance = 0.001;
                return Math.Abs(d1 - d2) <= tolerance;
            }
     
            private double _value;
            public double Value
            {
                get { return _value; }
                set
                {
                    if (CustomEquals(value, _value)) return;
                    _value = value;
                    OnPropertyChanged();
                }
            }
     
            private double _upperTreshold;
            public double UpperTreshold
            {
                get { return _upperTreshold; }
                set
                {
                    if (CustomEquals(value, _value)) return;
                    _upperTreshold = value;
                    OnPropertyChanged();
                }
            }
     
            private bool _isAboveUpperThreshold;
            public bool IsAboveUpperTreshold
            {
                get { return _isAboveUpperThreshold; }
                private set
                {
                    if (_isAboveUpperThreshold == value) return;
                    _isAboveUpperThreshold = value;
                    OnPropertyChanged();
                }
            }
        }
    }
    On peut utiliser des styles avec des DataTriggers de cette façon :

    Code XAML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    <Window x:Class="SimpleField.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
            xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:SimpleField"
            mc:Ignorable="d"
            DataContext="{Binding Main, Source={StaticResource Locator}}"
            Title="MainWindow" Height="350" Width="525">
        <StackPanel>
            <StackPanel.Resources>
                <Style TargetType="Border">
                    <Setter Property="Padding" Value="5"/>
                    <Setter Property="Margin" Value="5"/>
                </Style>
            </StackPanel.Resources>
            <Border>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Border BorderThickness="1" Margin="5" Padding="5">
                        <TextBlock>Température actuelle</TextBlock>
                    </Border>
                    <Border Grid.Column="1" DataContext="{Binding Temperature}" Margin="5" Padding="5" BorderThickness="1">
                        <Border.Style>
                            <Style>
                                <Setter Property="Border.BorderBrush" Value="Black"/>
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding IsAboveUpperTreshold}" Value="True">
                                        <Setter Property="Border.BorderBrush" Value="Red"/>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Border.Style>
                        <TextBlock Text="{Binding Value}">
                            <TextBlock.Style>
                                <Style>
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding IsAboveUpperTreshold}"  Value="True">
                                            <Setter Property="TextBlock.Foreground" Value="Red"/>
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </Border>
                </Grid>
            </Border>
            <Border>
                <Grid DataContext="{Binding Temperature}">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Border Grid.Row="0" Grid.Column="0">
                        <TextBlock Text="Température"/>
                    </Border>
                    <Border Grid.Row="0" Grid.Column="1">
                        <TextBox Text="{Binding Value, UpdateSourceTrigger=PropertyChanged}"/>
                    </Border>
                    <Border Grid.Row="1" Grid.Column="0">
                        <TextBlock Text="Seuil supérieur"/>
                    </Border>
                    <Border Grid.Row="1" Grid.Column="1">
                        <TextBox Text="{Binding UpperTreshold, UpdateSourceTrigger=PropertyChanged}"/>
                    </Border>
                    <Border Grid.Row="2" Grid.Column="0">
                        <TextBlock Text="Dépassement"/>
                    </Border>
                    <Border Grid.Row="2" Grid.Column="1">
                        <TextBlock>
                            <TextBlock.Style>
                                <Style>
                                    <Setter Property="TextBlock.Text" Value="Non"/>
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding IsAboveUpperTreshold}" Value="True">
                                            <Setter Property="TextBlock.Text" Value="Oui"/>
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </Border>
                </Grid>
            </Border>
        </StackPanel>
    </Window>

Discussions similaires

  1. [BI4] Problèmes changement de couleurs avec l'option Conditionnel
    Par gautier.c dans le forum Webi
    Réponses: 2
    Dernier message: 20/01/2015, 14h32
  2. [XL-2010] Formule conditionnelle changement de couleur de cellules
    Par chocoaccroc dans le forum Excel
    Réponses: 2
    Dernier message: 27/12/2012, 15h29
  3. Changement de couleur conditionnelle
    Par merocean dans le forum IHM
    Réponses: 3
    Dernier message: 08/07/2007, 15h02
  4. Réponses: 4
    Dernier message: 22/01/2007, 21h14
  5. Changement de couleur quand j'affiche du texte...
    Par MaxPayne dans le forum OpenGL
    Réponses: 3
    Dernier message: 10/12/2004, 13h55

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo