Як ви повністю видалите рамку кнопок у wpf?

129

Я намагаюся створити кнопку, яка має зображення в ній і не має меж - так само, як кнопки панелі інструментів Firefox, перш ніж навести на них курсор і побачити повну кнопку.

Я спробував встановити BorderBrushна Transparent, BorderThicknessна 0, а також спробував BorderBrush="{x:Null}", але ви все ще можете побачити контур кнопки.

wpf button transparency

— Стівен Євріс
джерело

1

alt відповідь

— Джейк Бергер

1

Кнопка без полів у WPF? !!! Як ти думаєш, це інтуїтивно зрозумілий інтерфейс ??

— Джош Ное

258

Спробуйте це

<Button BorderThickness="0"  
    Style="{StaticResource {x:Static ToolBar.ButtonStyleKey}}" >...

— Саймон
джерело

1

Фантастичний! Будь-яке інше рішення, яке я знайшов, є надзвичайно складним і передбачає переосмислення всіх стилів кнопки.

— Джонатан

10

На жаль, це відключає ефект налаштування HorizontalContentAlignmentна Stretch.

— Конрад Моравський

3

@ Cœur питання, вказані WPF не Silverlight

— Саймон

10

Це перетворення моєї кнопки в тумблер. Коли я натискаю кнопку, вона залишається вибраною, поки не натискаю іншу кнопку. Як я міг би перешкодити йому діяти так?

— burnttoast11

2

Я б схвалив це двічі, якби міг. Зберегли мені багато коду, щоб отримати вигляд, який я хочу.

— авенморе

52

Можливо, вам доведеться змінити шаблон кнопки, це дасть вам кнопку без кадру, але так само без жодного ефекту натискання чи відключення:

    <Style x:Key="TransparentStyle" TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border Background="Transparent">
                        <ContentPresenter/>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

І кнопка:

<Button Style="{StaticResource TransparentStyle}"/>

— Snehal
джерело

Я не знаю, чому інші рішення, здається, діють на інших людей. Це рішення є єдиним, яке може працювати, тому що рядок кордону ContentPresenter також видалено! Гарна робота!

— Nasenbaer

1

Я спробував кілька інших рішень, це єдине, що працює. btw, для новачків код <style> </style> повинен знаходитись у заголовку вашого xaml, як у <Window><Window.Resource> <Style> ....

— Фелікс

1

також є друкарська помилка у відповіді: <Button Style="{StaticResource TransparentButton}"/>має бути<Button Style="{StaticResource TransparentStyle}"/>

— Фелікс

Працювало і для мене, чудове рішення!

— bbqchickenrobot

Працювало для мене, фантастичне рішення!

— Контанго

23

Що вам потрібно зробити, це щось подібне:

<Button Name="MyFlatImageButton"
        Background="Transparent"
        BorderBrush="Transparent"
        BorderThickness="0" 
        Padding="-4">
   <Image Source="MyImage.png"/>
</Button>

Сподіваюся, що це те, що ви шукали.

Редагувати: Вибачте, забув згадати, що якщо ви хочете побачити рамку кнопок при наведенні на зображення, все, що вам потрібно зробити, - пропустити Padding = "- 4" .

— Альфред Б. Тордарсон
джерело

1

Це працює, і це дуже приємна ідея в деяких випадках

— цікавість

Це чудово працює, коли потрібно розтягнути зображення всередині кнопки. Видалення накладки дозволяє зображенню займати повні розміри кнопки.

— visc

23

Я не знаю, чому інші не вказали, що це питання дублюється з цим із прийнятою відповіддю .

Наводжу тут рішення: Вам потрібно перевизначити ControlTemplateз Button:

<Button Content="save" Name="btnSaveEditedText" 
                Background="Transparent" 
                Foreground="White" 
                FontFamily="Tw Cen MT Condensed" 
                FontSize="30" 
                Margin="-280,0,0,10"
                Width="60"
                BorderBrush="Transparent"
                BorderThickness="0">
    <Button.Template>
        <ControlTemplate TargetType="Button">
             <ContentPresenter Content="{TemplateBinding Content}"/>
        </ControlTemplate>
    </Button.Template>  
</Button>

— Нам Г ВУ
джерело

5

Якщо ви не помістите вміст всередину кнопки, він не буде реагувати на кліки. Ви можете це виправити, загорнувши цей ContentPresenter у рамку з прозорим фоном. Таким чином ви можете зробити пусту / прозору кнопку будь-якого розміру для розміщення над зображенням.

— bj0

3

Ви можете використовувати гіперпосилання замість кнопки так:

        <TextBlock>
            <Hyperlink TextDecorations="{x:Null}">
            <Image Width="16"
                   Height="16"
                   Margin="3"
                   Source="/YourProjectName;component/Images/close-small.png" />
            </Hyperlink>
        </TextBlock>

— Сергій Гусев
джерело

2

Ви, можливо, вже знаєте, що розміщення вашої кнопки всередині панелі інструментів дає вам таку поведінку, але якщо ви хочете, щоб щось працювало на ВСІХ поточних темах з будь-якою передбачуваністю, вам потрібно створити новий ControlTemplate.

Рішення Прашанта не працює з кнопкою не на панелі інструментів, коли кнопка має фокус. Він також не працює на 100% із темою за замовчуванням у XP - ви все ще можете побачити слабкі сірі рамки, коли фон вашого контейнера білий.

— міхетан
джерело

1

Програмно ви можете це зробити:

btn.BorderBrush = new SolidColorBrush(Colors.Transparent);

— Рікардо
джерело

1

Я не думаю, що це може бути корисним, оскільки він шукає рішення на стороні XAML

— Mohamed Kamel Bouzekria

-1

Чому б вам не встановити те Background & BorderBrushсамеbrush

 <Style TargetType="{x:Type Button}" >
        <Setter Property="Background" Value="{StaticResource marginBackGround}"></Setter>
        <Setter Property="BorderBrush" Value="{StaticResource marginBackGround}"></Setter>            
 </Style>

<LinearGradientBrush  x:Key="marginBackGround" EndPoint=".5,1" StartPoint="0.5,0">
    <GradientStop Color="#EE82EE" Offset="0"/>
    <GradientStop Color="#7B30B6" Offset="0.5"/>
    <GradientStop Color="#510088" Offset="0.5"/>
    <GradientStop Color="#76209B" Offset="0.9"/>
    <GradientStop Color="#C750B9" Offset="1"/>
</LinearGradientBrush>

— Муміт
джерело