Як я можу досягти пунктирної або пунктирної межі в WPF?

74

У мене є ListViewItemте, що я застосовую Styleдо, і я хотів би поставити пунктирну сіру лінію внизу Border.

Як я можу це зробити у WPF? Я бачу лише однотонні пензлі.

— дан
джерело

Ви перевіряли це stackoverflow.com/questions/1630022/…

— Alex Aza

1

Ні - Дякую за це. Ви не знаєте простого способу? Здається, це трохи хак.

— дан

Пов'язаний пост, і , ймовірно , краща відповідь stackoverflow.com/questions/14936002 / ...

— jv_

114

Це чудово працювало в нашому додатку, дозволяючи нам використовувати справжній кордон і не возитися з прямокутниками:

<Border BorderThickness="1,0,1,1">
   <Border.BorderBrush>
      <DrawingBrush Viewport="0,0,8,8" ViewportUnits="Absolute" TileMode="Tile">
         <DrawingBrush.Drawing>
            <DrawingGroup>
               <GeometryDrawing Brush="Black">
                  <GeometryDrawing.Geometry>
                     <GeometryGroup>
                        <RectangleGeometry Rect="0,0,50,50" />
                        <RectangleGeometry Rect="50,50,50,50" />
                     </GeometryGroup>
                  </GeometryDrawing.Geometry>
               </GeometryDrawing>
            </DrawingGroup>
         </DrawingBrush.Drawing>
      </DrawingBrush>
   </Border.BorderBrush>

   <TextBlock Text="Content Goes Here!" Margin="5"/>
</Border>

Зверніть увагу, що Viewport визначає розмір рисок у рядках. У цьому випадку він генерує тире з восьми пікселів. Viewport = "0,0,4,4" дасть вам тире в чотири пікселі.

— Ренд Скаллард
джерело

як це можна використовувати на інших елементах, які потребують того самого стилю.

— Charanraj Golla

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

— Rand Scullard

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

— ygoe

Зроблено таким чином, чи може зміщення тире все ще анімуватися?

— jrandomuser

незатверджене найкраще рішення. :)

— Крістіан Марк

98

Ви можете створити пунктирну або рисочку, використовуючи прямокутник, як у коді нижче

<Rectangle Stroke="#FF000000" Height="1" StrokeThickness="1" StrokeDashArray="4 4"
                                                       SnapsToDevicePixels="True"/>

Почніть із цього та налаштуйте перегляд списку відповідно до вашого сценарію

— biju
джерело

2

Будь-який спосіб зробити це із закругленими кутами?

— Йорданія

7

@ Йорданія Використання RadiusX="10" RadiusY="10".

— Ondrej Janacek

24

Трохи пізно на вечірку, але наступне рішення спрацювало для мене. Це трохи простіше / краще, ніж обидва інші рішення:

<Border BorderThickness="1">
  <Border.BorderBrush>
    <VisualBrush>
      <VisualBrush.Visual>
        <Rectangle StrokeDashArray="4 2" Stroke="Gray" StrokeThickness="1"
                  Width="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=ActualWidth}"
                  Height="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=ActualHeight}"/>
      </VisualBrush.Visual>
    </VisualBrush>
  </Border.BorderBrush>

  <TextBlock Text="Whatever" />
</Border>

— dotNET
джерело

Блискучість. Перша відповідь була поганою із закругленими кутами. Цей працює чудово. Просто встановіть RadiusX / Y на прямокутнику на той самий CornerRadius, що на кордоні.

— Білл Тарбелл,

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

— Ерік Бонгерс,

... однак! Якщо ви використовуєте цю щітку як staticresourceабо dynamicresource, щось піде не так. Я припускаю, що через Widthі Heightприв'язки не вдалося. Перша відповідь робить роботу в якості багаторазового ресурсу. Шкода. Мені дуже подобається це рішення.

— Ерік Бонгерс,

3

Xaml

<Grid>
<Grid.RowDefinitions><RowDefinition Height="auto"/></Grid.RowDefinitions>
<Grid.ColumnDefinitions><ColumnDefinition Width="auto"/></Grid.ColumnDefinitions>
<Rectangle RadiusX="9" RadiusY="9" Fill="White" Stroke="Black" StrokeDashArray="1,2"/>
<TextBlock Padding = "4,2" Text="Whatever"/>
</Grid>

— Дрея Рія
джерело