I want to set shadow to parent view. But I want child views to remain the same.
What I do now is
parentView.layer.shadowRadius = 0.8;
parentView.layer.shadowOpacity = 0.3;
parentView.layer.shadowOffset = CGSizeMake(1.0, 1.4);
However, if I do this, the child views are also changed. Is there a way to set the shadow but keep the child views the same.
Thank you
Is your parentView by any chance transparent? I've set up a simple project and used your code. I've changed some values to see a shadow a little better. This is how it looks:
As you can see - no shadow on the subview. parentView's background color is set to white. When I set it to clear color this is what happens. I added the border to prove that parentView is still there:
Apple Docs prove this:
Figure A-7 shows several different versions of the same sample layer
with a red shadow applied. The left and middle versions include a
background color so the shadow appears only around the border of the
layer. However, the version on the right does not include a background
color. In this case, the shadow is applied to the layer’s content,
border, and sublayers.
Related
I want to create a window which is fully transparent and which can be used for drawing (On-Screen-Display). It's actually quite simple to create such a window, the one has to set the opaque property to false and fill the corresponding view with a clear color. After that the CGImage can be drawn using the graphical context to update the view and the corresponding regions with alpha channel will be transparent / semi-transparent.
I decided to make the same thing but using the Metal API, i.e. I replaced my view with a MTKView and used textures instead of CGImage to draw onto the window. I read the corresponding chapters from Apple Documentation, then I took one of the examples ("Basic Texturing") and decided to modify it in order to test if it would work:
I modifed the example by settings the opaque property of the window to NO.
In the first line of drawInMTKView function I changed the clearColor in the following way: view.clearColor = MTLClearColorMake(0.0, 0.0, 0.0, 0.0); (as shown "Devices and Commands" tutorial from docs).
Then I changed the alpha channel value of the loaded image in AAPLImage.h from dstImageData[dstPixelIndex + 3] = 255; to dstImageData[dstPixelIndex + 3] = 125;.
After all these change, I would expect that my view is fully transparent (the clear color is a fully transparent color) and that the parts of the texture with the alpha channel would have the corresponding transparency level. However the view is black by default and I cannot make parts of the view (or the whole view) transparent.
I may assume that I have to add some additional configuration to the rendering pipeline in order to make it work. However it could be that such things are not possible with Metal, but I'm not sure about that.
Also I tried to follow the suggestions from Metal MTLTexture replaces semi-transparent areas with black when alpha values that aren't 1 or 0 , but unfortunately it did not help.
There is also an isOpaque property on the view class that may need to be false. In iOS (UIView), you can simply set it, but in macOS (NSView) you need to override it to return false.
I am finding it difficult to set the right look and feel of a CN1 Slider control. Essentially i want it to look like the one in the CN1 Default Demo of the Theme window, and have it with the Thumb image to allow the user to set the scroll.
But when i code it up as per online examples, it comes out skinny on the simulator (as below)
...but doesn't display the line at all on the actual iphone device.
When i start messing with the methods, such as 'getSliderEmptyUnselectedStyle()' then this makes the background show and can see the progress but its tall and i cannot seem to shrink it.
Container container = new Container(new FlowLayout());
container.getAllStyles().setBgTransparency(255);
container.getAllStyles().setBgColor(0xffffff);
Slider slider = new Slider();
// slider.getAllStyles().setFgColor(0);
// slider.getAllStyles().setMarginLeft(0);
// slider.getSliderEmptyUnselectedStyle().setBgTransparency(255);
// slider.getSliderFullUnselectedStyle().setBgTransparency(255);
// slider.getSliderEmptySelectedStyle().setBgTransparency(255);
// slider.getSliderFullSelectedStyle().setBgTransparency(255);
// slider.getSliderEmptyUnselectedStyle().setBgColor(0xffffff);
// slider.getSliderFullUnselectedStyle().setBgColor(0x42B72A);
// slider.getSliderEmptySelectedStyle().setBgColor(0xffffff);
// slider.getSliderFullSelectedStyle().setBgColor(0x42B72A);
Style sliderStyle = UIManager.getInstance().getComponentStyle("Label");
sliderStyle.setFgColor(0);
slider.setThumbImage(
FontImage.createMaterial(FontImage.MATERIAL_RADIO_BUTTON_CHECKED, sliderStyle, 4).toImage());
slider.setMinValue(0);
slider.setIncrements(25);
slider.setProgress(entity.getCompletion_pct());
slider.setEditable(true);
container.add(slider);
return container;
How can i get it pretty much to the CN1 example?
Thanks
The slider in the example used a 9-piece border or a 3-piece border both of which have a fixed minimum height/width. This minimal height is applied to the way the slider is rendered.
Your code can be made thicker with padding but it will create a problem when you add a thumb. Once you add the thumb it will increase the overall size and make the entire height of the thumb have that background. So you need to style this via the designer and for this specific case you would want to use an image border that is carefully measured to align with the thumb image.
Also notice you used getAllStyles() which is wrong. Slider is a special case and uses the Slider and SliderFull UIID so effectively the component has two UIID's and two separate sets of Style objects.
I'm presenting a view in an NSPopover, using code based on this sample code.
The view, and all of its sub-views, are layer-backed. There's a single NSImageView, and several non-editable NSTextFields. The text fields backgroundColors are set to [NSColor textBackgroundColor], and their textColors to [NSColor textColor]. In this way, the text is black if one is using the normal theme, and white if one is using the "dark menu bar and Dock" option (which I'll refer to as "dark theme" from now on). This all works fine, and it looks a little somethin' like this:
Light theme:
Dark theme:
The problem comes when I animate the NSImageView up off the view. As it intersects with the NSTextFields, the image appears to blend with the text fields in an unappealing manner. It happens in both light and dark themes, but it's more icky-looking (it's a technical term) in the dark theme. Dig it:
The code to animate it looks basically like this:
CABasicAnimation* positionAnimation = [CABasicAnimation animationWithKeyPath:#"position"];
positionAnimation.fromValue = [NSValue valueWithPoint:fromPoint];
positionAnimation.toValue = [NSValue valueWithPoint:toPoint];
positionAnimation.duration = imageAnimationDuration;
[self.imageView.layer addAnimation:positionAnimation forKey:#"position"];
self.imageView.layer.position = toPoint;
What have I tried? Oh, what haven't I tried?
First off, my own views don't have any kind of NSVisualEffectView going on. But it seems that NSPopover adds that on its own; you can clearly see my desktop bleeding through the popover in the animation above. That's fine; it's actually a nice effect. But, thinking that my NSImageView was trying to be vibrant, I subclassed NSImageView just to return NO from allowsVibrancy. No change in behavior.
Next, I subclassed NSView to return NO from allowsVibrancy, and made the parent view of my view an instance of that. No change in behavior.
My NSTextFields are set with drawsBackground = NO, so I changed them to YES. No change in behavior. Then, leaving drawsBackground = YES, I set both text field's backgroundColors to [NSColor clearColor]. Here's where it gets weird. This does make the weird drawing go away, but it changes the text color of one of the text fields (the smaller one) to black. Wut? See below.
I gave up on the background colors, and started messing with the text colors. I found that if I set the textColor of the text fields to a discrete color (say, [NSColor blackColor] or [NSColor whiteColor], then the weird drawing problem also goes away. It seems only to get weird when using colors which adapt with the theme such as [NSColor textColor]. That's super lame, because the whole point of using something like [NSColor textColor] is that it adapts to the theme. I could probably hack around and figure out what theme is active and set the colors manually, but I really don't want to go that route if I can help it.
I promise there's a question in here somewhere, and, mercifully, here it is:
How can I fix the animation issue shown above, while still using colors which properly adapt to the current theme?
Sample project on GitHub.
Edit:
The desired result is to have no blending between the image and the text. Something like this:
The image I used in the sample app here maybe isn't the best example to convey the sheer yuckiness of the animation I'm seeing in my actual app. The image in the sample is already mostly white, while in my actual app it's mostly black, and it truly looks horrible when blended with white text.
Visual Effect Views (like used in NSPopover) are totally messed up in OS X Yosemite and they are causing your problem here. It is not your fault, these views are totally buggy.
A workaround on Yosemite should be to set the appearance property of each NSTextField to NSAppearanceNameAqua. Because if the labels don't try to do some weird vibrancy effect, they can't mess things up. The labels still look the same and the strange effect is gone.
My words in code:
self.titleLabel.appearance = [NSAppearance appearanceNamed:NSAppearanceNameAqua];
self.descriptionLabel.appearance = [NSAppearance appearanceNamed:NSAppearanceNameAqua];
Luckily NSVisualEffectView's are working fine now in El Capitan. So your code should work fine there..
This question already has an answer here:
Holes in NSView or NSWindow
(1 answer)
Closed 6 years ago.
I want to have a more or less standard NSWindow with a toolbar and all that, but I want the content view to be transparent so that I can see through it. At the same time I want to keep the light gray outline of the window and also it's shadow. BUT I want to avoid the "inner" shadow I get from the toolbar inside the content view area.
What I have tried so far is just to set the window background color to a semi transparent color and also set opaque to NO. The problem is that the window border fades away with the alpha of the background itself, and the more transparency I have on the background, the more the shadow of the toolbar shows up within the content view.
Generally, the window shadow and border changes depending on the transparency of the content view, which I totally understand. But I want a behavior where it keeps the border and shadow just as if it was a completely opaque window, and then I want the content view area to be transparent.
I am not sure what I need to do conceptually to make it work. Maybe I have to draw the window border myself, maybe not. Maybe I need to draw the shadow myself, or maybe not.
Is there anyone that know how to build this? I don't need exact code details, but rather what parts I need to do custom..
I appreciate any input!
I dont't know if this is of any value for you after all this time but try:
[aWindow setOpaque:NO];
[aWindow setBackgroundColor:[NSColor clearColor]];
Subclass the NSView class, override the drawRect:(NSRect)dirtyRect method and set the color of the view as clearcolor, now set the class of your content view as the Subclass of NSView.
I have an NSWindow with 2 NSViews (an NSSplitView and a custom NSView). Accessing the data to populate these views can take some time. During this period, I'd like to gray out the content of these views.
My first approach was to have a black third NSView that covered the other 2 and achieve the graying out effect by changing its alpha value. However I've since learned having a hierarchy with sibling views is undefined.
What is the best approach here?
Cache the NSBitmapImageRep of the 2 views, then replace them with the 3rd view, using the cached image(s) as background
Set the alpha value for each view separately (still not quite sure how to get the black background for the graying effect)
Something I haven't considered
I'd use a child window. Set its content view to a plain black view (hopefully with status and progress information in subviews), and its alpha value to the desired fade-out, and add it as a child window of the window whose content you want to fade out.
I'd teach the views how to draw themselves in a disabled state, but there are other suggestions here:
How can I darken everything displayed in a single NSView?