We Keep Coding

XAML advice for implementing tab-bar

Is it possible to achieve the following visual effect in .NET MAUI/XAML:
The main concern is the outline (or lack thereof on the bottom) of the selected tab and the underline of the unselected tabs.
The goal is to be able to define an arbitrary number of Tabs for the application.
Is this possible with XAML alone?
Any help would be greatly appreciated

If I had to create custom controls I would go with the GraphicsView.
Create a custom control Tab with a canvas that draw it in function of it state, you can use StackLayout to stack them and TapGestureRecognizer to manage clicks events.
One of the main problem of a GraphicsView is that you can't attach click event to shapes you are drawing (one solution there) so you can't be really precise on the events if you don't want to manage bounding box yourself.
Or you can just use ImageButton for the tabs with a label in front for the text, it would be way easier but less flexible (tabs should all be the same sizes).

WPF Grid renders shadow/border on the left and right side

I'm working on a project using wpf.
The UI design is based on a tile system, where you can drag and drop tiles to specific locations.
The presentation of the tiles uses a customized TreeView that renders the items as Grids.
looking close to the rendered grid items i recognized that wpf renders the grid with shadows on the left and the right side.
Does anyone have an idea why there are shadows rendered? For a specific feature i have to color the bottom part of the grid red and it looks awkward cause of the rendered shadow.

Late to the party but for someone with same issue which seems to be the result of using Effect in the application like DropShadowEffect It solved my issue by adding following line to the Grid/Border ...
UseLayoutRounding="True"

panorama control with scroll

I'm really new to programming but decided I will start learning c# development for windows phone 8. I know they have a button control in the toolbox but I am looking to make the kind of buttons you see on the start screen for the phone. No idea how.
Also I would love to know how to use the panorama control and how to incorporate the buttons asks previously to have an image and put into a verticals scroll layout, separated by panorama items of course. Please note as I said before I'm super new and don't know much yet.

To make start screen buttons alike (a.k.a tiles) take a look here. Download the examples and look under HubTile.
Now for the second part of your question all you need is a panorama page with a WrapPanelthat can also be found in the toolkit mentioned earlier.
So what you should be doing is adding a WrapPanel inside the PanoramaItem, and then the HubTiles inside the wrap panel. Here is an example:
<controls:PanoramaItem Header="hubtiles">
<Grid>
<toolkit:WrapPanel Orientation="Horizontal">
<toolkit:HubTile/> <!-- Change accordingly -->
</toolkit:WrapPanel>
</Grid>
</controls:PanoramaItem>

How to reuse WPF ScrollViewer to create my own scrollable control?

I'm trying to improve the graph drawing control that comes with Graph#. It's good, but things get out of hand when you start dragging nodes around. This is my first encounter with WPF, so this is probably a newbie question. :)
I have the GraphCanvas control which has nodes and edges on it. They can be dragged around which changes their coordinates, possibly making them negative. I would like to add scrollbars to the control which would allow to see how big the canvas really is.
To this end I'm thinking of putting the GraphCanvas inside a ScrollViewer. Which would be pretty easy and straightforward if not for one problem. I may not resize the GraphCanvas itself when a node is dragged outside the borders or this will mess up dragging bad. That is also the problem with the original control (check it out, it comes with a sample application).
It would be good if I could bind the scrollbar size/location to properties of the GraphCanvas, so that the ScrollViewer would not scroll anything physically, but just set the properties of GraphCanvas. That in turn would perform all actual calculations and scrolling.
How can this be done?

OK, I found it! Three easy steps:
Implement System.Windows.Controls.Primitives.IScrollInfo on your custom control;
Add your custom control to a ScrollViewer;
Set the CanContentScroll property on the ScrollViewer to True.
Voila!

Check out this link straight from MSDN. It talks about composing several controls into a single Composite Control:
WPF: Customizing Controls for Windows Presentation Foundation

Drag&Drop-adorner in deeply nested visual trees

We have a WPF application that has custom windows on a canvas which in turn contain custom controls (the main canvas containing the custom windows is again custom control displaying stuff). So basically the visual tree looks like this (without implicit Borders and other things):
- Windows
- Canvas
- WindowMgr
- CustomWindow (maximized with z-index 0, functioning as background)
- ScrollPresenter
- CustomControl1
- CustomWindow
- ScrollPresenter
- CustomControl2
Now we need drag&drop from those custom controls to each other (usually from a movable window to the background window). To show the drag&drop adorner an adorned element and an adorner layer is needed. Usually examples use their grid or itemscontrol for that, and also get the adorner layer from the same element.
Doing the same here doesn't work since the ScrollPreseneter/CustomWindows clip their content which prevents you from dragging out of the window. For now we walk up the visual tree until we find the root canvas and use that as adorned element, but that seems kind of dirty (and as we experienced isn't very robust).
Any suggestions on a robust solution for this?

If I read your question correctly and since you didn't mention it yourself you might be looking for the AdornerDecorator Class, which Provides an adorner layer for elements beneath it in the visual tree.
Assuming from its name that ScrollPresenter is derived from ContentPresenter, it's worth noting that for implementing advanced custom controls you might want to surround their ContentPresenter by an AdornerDecorator, just like the Window Class does, see for example Don’t forget the AdornerDecorator for a nice real work scenario involving drag&drop too.
That is, by means of the AdornerDecorator you'll ensure the required AdornerLayer to be contained within your custom control, hence removing the need to retrieve it elsewhere by walking up the visual tree, e.g.:
<ControlTemplate TargetType="{x:Type CustomWindow}">
<Border ...>
<Grid>
<AdornerDecorator>
<ScrollPresenter ... />
</AdornerDecorator>
</Grid>
</Border>
</ControlTemplate>
Depending on your particular scenario you might need an AdornerDecorator for your custom windows, your custom controls or both.
See Adorners Overview for more details on the adorner architecture.