How to add company logo to NavigationPage TitleIcon? - c#

So I'm trying to add a company logo to the middle of my NavigationPage Title section, and I have tried to use NavigationPage.TitleIcon="companytitleicon.png" inside XAML, but it doesn't display. I'm not certain if it's because the image has to be a certain size, and I cannot find information in the documentation.
I played around with other code as well, like calling NavigationPage.SetTitleIcon which takes a reference to a page and a FileImageSource like so:
NavigationPage.SetTitleIcon(this, "/Assets/dischemtitleicon.png");
I may be using it incorrectly, so I need a bit of advice, in general, with getting the logo to display on the Title section. I'll add a screenshot as well to specify the location and size of the logo. The logo is at least twice as wide as the height, eg. 120 x 50 ...
Any assistance will be truly appreciated. I'm also trying to get the colour of the MasterDetail bar to change, but that's not as crucial of an issue. (I added a global StaticResource that applies a fixed colour to all NavigationPage BarBackgroundColors)

If you are using a Xamarin.Forms app based on Shell then you can easily achieve this using Shell.TitleView without the need of a custom renderer, define your title content, bind it or even style it as you like.
You could refer to my similar answer https://stackoverflow.com/a/65062752/522820

Related

How would you create stackable rectangles in Xamarin C# for iOS?

I have a UIView that I want to fill with multiple rectangles stacked on top of each other horizontally at 100% width. They all need to have their own name and need to work for any iOS device regardless of size.
Here's a simple diagram showing what I would like to accomplish:
With Xamarin.Forms, this is achieved by using a StackLayout.
http://iosapi.xamarin.com/?link=T%3aXamarin.Forms.StackLayout
I find it difficult to control the exact sizes of StackLayouts if you're not sure of the size of your content.
If i need something to stay fixed size, i use Grids:
http://iosapi.xamarin.com/?link=T%3aXamarin.Forms.Grid
I would recommend XibFree for this:
http://www.toptensoftware.com/xibfree/
They have a few great examples which covers these case as well:
http://www.toptensoftware.com/xibfree/example_2
http://www.toptensoftware.com/xibfree/example_1
If you would need any more help with XibFree feel free to ask anything in comment :)

Stroke on text in Windows Store App

I am developing a windows 8 metro Application and I want to add stroke to the text. I found out that there is no built-in function to do that. I tried to overlap two texts with different size but that was not giving the desired result. I want the result that the Cut The Rope is using. Here is a screenshot :
I want the effect where they have written total 36 as the number can vary.
I Unzipped there .xap file and checked there assets to see whether they are using image but there were no image.
I am stuck on this... Please help, I want to achieve this in C#/XAML.
On a quick search I didn't find anything relevant, but you could try something else :
Why not use a font which already has a stroke? You can use a lot of kind of fonts, as long as you add them to your project.
As you can read here, it's quite easy.
Add your font file to your project and set the Build Action from Properties to Content. Then use it in FontFamily in XAML :
<TextBox Text="sampleText" FontFamily="Assets/Fonts/FontFileName.ttf#FontName" />

Own layout for LiveTiles

I'd like to make some fancy live tiles. But I am not quite happy with the default options for it. Is there a way in C#/XAML or any site, that shows how to put an own design for a live tile?
the default font size of the Tile cannot be changed. You can only change the text. What you can do is create an image that has text on it and set that to the BackgroundImage or the BackBackgroundImage. You can create an image by using the WriteableBitmap or WriteableBitmapEx.

Title on the secondary tile is not clear

I have a problem about secondary tile. The title of my secondary tile is not obvious on the background image. So I want to add a title background which is a rectangle with the similar size as my title. But how can I do that? I have two ways in my mind.
Get my background image from internet, add the title background on it and store it locally. And when I make the tile, I'll use the local url. This method looks kind of overkill. I have to download the image and do some integration. And also I have to store the image locally.
Customize the title control, change its foreground. This method looks more elegant. But I'm not sure how I can customize the title in the secondary tile. Any suggestions?
Thanks!
Your first method is probably what you want. As far as I know, there's very little custmization you can do with the Standard tile class.
I was unhappy with the text for other reasons and ended up doing the equivalent of your 1st suggestion.

Create a 5 star-rating control with hover images without JavaScript

Is there a way to implement a 5-star rating control, that supports changing the images of the 5 stars upon hover, without the use of Javascript? A click would need to perform a HTTP POST
To get a better understanding I searched for a sample and found http://orkans-tmp.22web.net/star_rating/ (Scroll to "Quick example with SELECT options")
As far as my knowledge of HTML goes, it is not possible to have multiple images / buttons that perform a Post (to know which rating was given by the user), and simultaneously change multiple background images.
Here is an example from CSS3 Secrets
jsfiddle
You can use css selectors to get what you want done without javascript.
You can change the image using CSS. Just apply a class and give it the :hover option.
i.e.
.star:hover
{
color:blue;
}
I assume that you would want all previous stars to change color as well on hover, this would be possible, but quite difficult. We'll start with an image of 5 starts (all highlighted) and an image of a single unhighlighted start. Place five of the unhighlighted starts right on top of each other (set the absolute postion). Adjust the intend of the stars so that each is indented more than the last and they are laid out properly (without actually overlapping each other). Add a CSS on hover that's different for each one. It will need to replace the image with the 5 stared highlighted image. The width will need to be set so that only the appropriate number of stars is shown. The z-index will need to be set so that it is on top of the unhighlighted images of all previous stars.
Is it possible 2 use the OnMouseOver and OnMouseOut option to create the same effect of a hover?

Categories

Resources