Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>If I understand your question correctly you want those Black squares in you image to be transparent?</p> <p><strong>Update</strong>: Uploaded sample project here: <a href="http://www.mediafire.com/?5tfkd1cxwfq0rct" rel="nofollow">http://www.mediafire.com/?5tfkd1cxwfq0rct</a></p> <p>I think the problem is that the <code>Panel</code> inside the <code>VisualBrush</code> won't stretch. You could get the desired effect by Binding the Width and Height of whatever <code>Panel</code> you use to the ActualWidth and ActualHeight of the <code>Border</code></p> <pre><code>&lt;Border Name="border" BorderBrush="Red" BorderThickness="1" CornerRadius="5"&gt; &lt;Border.OpacityMask&gt; &lt;VisualBrush&gt; &lt;VisualBrush.Visual&gt; &lt;Grid Width="{Binding ElementName=border, Path=ActualWidth}" Height="{Binding ElementName=border, Path=ActualHeight}"&gt; &lt;Grid.ColumnDefinitions&gt; &lt;ColumnDefinition Width="20"/&gt; &lt;ColumnDefinition Width="*"/&gt; &lt;ColumnDefinition Width="20"/&gt; &lt;/Grid.ColumnDefinitions&gt; &lt;Grid.RowDefinitions&gt; &lt;RowDefinition Height="20"/&gt; &lt;RowDefinition Height="*"/&gt; &lt;/Grid.RowDefinitions&gt; &lt;Rectangle Fill="Transparent" Grid.Column="0"/&gt; &lt;Rectangle Fill="Black" Grid.Column="1"/&gt; &lt;Rectangle Fill="Transparent" Grid.Column="2"/&gt; &lt;Rectangle Fill="Black" Grid.Row="1" Grid.ColumnSpan="3"/&gt; &lt;/Grid&gt; &lt;/VisualBrush.Visual&gt; &lt;/VisualBrush&gt; &lt;/Border.OpacityMask&gt; &lt;Grid&gt; &lt;TextBlock Text="Testing OpacityMask with a rather long string................." Grid.ZIndex="3"/&gt; &lt;Rectangle Fill="Green"/&gt; &lt;/Grid&gt; &lt;/Border&gt; </code></pre> <p><strong>Update Again</strong><br> The DropShadowEffect for the Decorator Child of the <code>Border</code> seems to push the OpacityMask for the <code>Border</code> both Verticaly and Horizontaly. And what's even worse is that it seems to stack, so in your example when you have three DropShadowEffects for three nested <code>Decorators</code>, the sum of the BlurRadius is 45 (20+15+10) so the OpacityMask is pushed by a value of 45 (at least it looks like this is whats going on, but it's a little hard to tell..). You could try to compensate for this by increasing the ColumnDefinition Widths and RowDefinition Heights but I think it'll be hard to find a dynamic solution.</p> <p>A better approach to your problem may be to use <code>Border.Clip</code> but that doesn't come easy either.</p> <pre><code>Point1: 0, 2 Point2: 12, 2 Point3: 12, 0 Point4: Width of Border - 12, 0 Point5: Width of Border - 12, 2 Point5: Width of Border, 2 Point6: Width of Border, Height of Border Point7: 0, Height of Border </code></pre> <p><strong>Update 3</strong><br> Came up with a better solution that doesn't require so many Bindings. Create a custom class that derives from <code>Border</code> and override GetLayoutClip. This works both in Designer and Runtime. To increase flexibility of <code>ClippedBorder</code> you could introduce some Dependency Properties to use instead of the hardcoded 2 and 12. New sample app here: <a href="http://www.mediafire.com/?9i13rrqpbmzdbvs" rel="nofollow">http://www.mediafire.com/?9i13rrqpbmzdbvs</a></p> <pre><code>public class ClippedBorder : Border { protected override Geometry GetLayoutClip(Size layoutSlotSize) { PathGeometry pathGeometry = new PathGeometry(); pathGeometry.Figures = new PathFigureCollection(); //Point1: 0, 2 PathFigure pathFigure = new PathFigure(); pathFigure.StartPoint = new Point(0, 2); //Point2: 12, 2 LineSegment lineSegment1 = new LineSegment(); lineSegment1.Point = new Point(12, 2); //Point3: 12, 0 LineSegment lineSegment2 = new LineSegment(); lineSegment2.Point = new Point(12, 0); //Point4: Width of Border - 12, 0 LineSegment lineSegment3 = new LineSegment(); lineSegment3.Point = new Point(this.ActualWidth-12, 0); //Point5: Width of Border - 12, 2 LineSegment lineSegment4 = new LineSegment(); lineSegment4.Point = new Point(this.ActualWidth-12, 2); //Point5: Width of Border, 2 LineSegment lineSegment5 = new LineSegment(); lineSegment5.Point = new Point(this.ActualWidth, 2); //Point6: Width of Border, Height of Border LineSegment lineSegment6 = new LineSegment(); lineSegment6.Point = new Point(this.ActualWidth, this.ActualHeight); //Point7: 0, Height of Border LineSegment lineSegment7 = new LineSegment(); lineSegment7.Point = new Point(0, this.ActualHeight); pathFigure.Segments.Add(lineSegment1); pathFigure.Segments.Add(lineSegment2); pathFigure.Segments.Add(lineSegment3); pathFigure.Segments.Add(lineSegment4); pathFigure.Segments.Add(lineSegment5); pathFigure.Segments.Add(lineSegment6); pathFigure.Segments.Add(lineSegment7); pathGeometry.Figures.Add(pathFigure); return pathGeometry; } } </code></pre>
    singulars
    1. This table or related slice is empty.
    1. POUsing VisualBrush as OpacityMask
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USFredrik Hedblad
    1. USFredrik Hedblad
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POUsing VisualBrush as OpacityMask
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    3. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTUpMod
    1. COYes the black squares are supposed to be transparent. I tried your code and it doesn't work - it shows everything. I tried to increase Width/Height on Rows/Columns and it still shows the content.
      singulars
      1. PO
      1. USPaya
    2. CO@Paja: Ok, I uploaded my sample project which seems to be working. Try it out and let me know what the differences may be
      singulars
      1. PO
      1. USFredrik Hedblad
    3. CO@Paja: Just checking, did you set `Name="border"` for the `Border`?
      singulars
      1. PO
      1. USFredrik Hedblad
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload